!-- Modal -->
<div class="modal fade" id="idmodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="myModalTitle"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" id="myModalBody">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" id="myModalClose" data-dismiss="modal">Закрыть</button>
<button type="button" class="btn btn-primary" id="myModalSave">Сохранить</button>
</div>
</div>
</div>
</div>
<form id="js-form-add-entries"
method="POST" action="/entries/add"
enctype="multipart/form-data"
>
<div class="form-group">
<label>ФИО</label>
<input required type="text" name="fio" value="<?php echo @$data['fio']; ?>" class="form-control"
id="fio">
</div>
<div class="form-group">
<label>Email</label>
<input type="email" name="email" value="<?php echo @$data['email']; ?>" class="form-control"
id="email">
</div>
<div class="form-group">
<label>Phone</label>
<input type="text" name="phone" value="<?php echo @$data['phone']; ?>" class="form-control"
id="phone">
</div>
<div class="form-group">
<label>Photo</label>
<input type="file" name="photo" value="<?php echo @$data['photo']; ?>" class="form-control"
id="photo">
</div>
<input type="hidden" name="CSRF_TOKEN" value="<?php echo @$data['CSRF_TOKEN']; ?>" >
<?php
if (!empty($data['errors'])) { ?>
<div class="alert alert-danger fade show" role="alert">
<?php echo array_shift($data['errors']) ?>
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<?php } ?>
</form>
$(document).ready(function () {
$(document.body).on('click', '#js-add-entries', function () {
var $button = $('#js-add-entries');
$('#myModalTitle').html('Добавить запись');
$('#idmodal').modal({show: true});
$('#myModalBody').text('');
$.getJSON($button.data('action'), function (data) {
$('#myModalBody').append(data.forms);
});
$('#myModalSave').bind('click', function () {
var $form = $('#js-form-add-entries');
$form.submit(function(e) {
e.preventDefault();
var $form = $(this);
var $formData = new FormData($form.get(0));
var isValidFiles = validateFiles({
$files: $form.find('#photo'),
maxSize: 2 * 1024 * 1024,
types: ['image/jpeg', 'image/jpg', 'image/png']
});
var isValidEmail = validateEmail($form.find('#email').val());
if (!isValidEmail) {
console.log('client validation email: ', isValidEmail);
return false;
}
console.log(isValidEmail);
if (isValidFiles.length) {
console.log('client validation errors: ', isValidFiles);
return false;
}
console.log(isValidFiles);
$.ajax({
type: 'POST',
url: $form.attr('action'),
dataType: 'json',
contentType: false,
processData: false,
data: $formData,
cache: false,
success: function (data) {
if (data.success != false) {
$('#idmodal').modal('hide');
} else {
$('#myModalBody').text('');
$('#myModalBody').append(data.forms);
}
}
});
});
$form.submit();
})
});
});
$(document).ready(function () {
initSubnit = function() {
var $form = $('#js-form-add-entries');
var $formData = new FormData($form.get(0));
$.ajax({
type: 'POST',
url: $form.attr('action'),
dataType: 'json',
contentType: false,
processData: false,
data: $formData,
cache: false,
success: function (data) {
if (data.success != false) {
$('#myModalBody').text('');
$('#idmodal').modal('hide');
} else {
$('#myModalBody').text('');
$('#myModalBody').append(data.forms);
}
}
});
};
validate = function () {
var $form = $('#js-form-add-entries');
$('.form-control').removeClass('is-invalid'); // remove the error class
$('.invalid-feedback').remove(); // remove the error text
var isValidFiles = validateFiles({
$files: $form.find('#photo'),
maxSize: 2 * 1024 * 1024,
types: ['image/jpeg', 'image/jpg', 'image/png'],
required: false
});
if (isValidFiles.length) {
$form.find('#photo').addClass('is-invalid');
$('#photo-group').append('<div class="invalid-feedback">Не правильный файл</div>');
}
var isValidEmail = true;
var email = $form.find('#email').val();
if (!isEmpty(email)) {
isValidEmail = validateEmail(email);
if (!isValidEmail) {
$form.find('#email').addClass('is-invalid');
$('#email-group').append('<div class="invalid-feedback">Не правильный Email</div>');
}
}
var isValidPhone = true;
var phone = $form.find('#phone').val();
if (!isEmpty(phone)) {
isValidPhone = validatePhone(phone);
if (!isValidPhone) {
$form.find('#phone').addClass('is-invalid');
$('#phone-group').append('<div class="invalid-feedback">Не правильный Phone</div>');
}
}
var isEmptyFio = isEmpty($form.find('#fio').val());
if (isEmptyFio) {
$form.find('#fio').addClass('is-invalid');
$('#fio-group').append('<div class="invalid-feedback">Не должен быть пустым</div>');
}
if (isValidFiles.length || !isValidEmail || isEmptyFio || !isValidPhone) {
return false;
}
return true;
};
$(document.body).on('click', '#js-add-entries', function () {
var $button = $('#js-add-entries');
$('#myModalTitle').html('Добавить запись');
$('#idmodal').modal({show: true});
$('#myModalBody').text('');
$.getJSON($button.data('action'), function (data) {
$('#myModalBody').append(data.forms);
});
$('#myModalSave').bind('click', function () {
if (validate()) {
initSubnit();
}
})
});
});