Здравствуйте. Нормального решения данной задачи я не нашел ни с помощью гугла ни с помощью яндекса.
У меня есть форма, в ней есть куча текстовых полей, когда юзер сабмитит форму, запускается функция JS которая собирает все данные, валидирует их, складывает в объект и отправляет PHP, потом уже в PHP я их отправляю на почту. Все было чудесно пока мне не пришлось добавить в эту форму загрузку файла.
И вот проблема заключается в том, что бы не нарушая прошлой конструкции просто добавить еще файл.
Вот пример моей функции:
submit_button.click(function() {
//Определяем все значения в форме
contact_name = $('#contact_name').val();
contact_city = $('#contact_city').val();
//Теперь проверим нет ли в форме не заполненых данных,
//или ошибок
var errorList = '';
errorList = errorList + validation('contact_name');
errorList = errorList + validation('contact_city');
if (errorList == '') {
//Если нет ошибок то отправляем данные в PHP
var dataObject = {
'contact_name': contact_name,
'contact_city': contact_city
}
//Конвектируем данныв в JSON
var data = JSON.stringify(dataObject);
//Отправляем
$.ajax({
type: "post",
url: "/api/job",
data: {data: data},
beforeSend: function() {
//Перед оправкой данных отображаем лоадер возле кнопки сабмита
//Что бы юзер понимал, что процес стартонул
$('.line_loader').show();
},
success: function(msg) {
var messages = $.parseJSON(msg);
if (messages['result'] === true) {
$('.wrap').hide();
$('.container').removeClass('job_white_wrap');
$('.container').addClass('job_inv_wrap');
$('.success_div').show();
} else {
$('.wrap').hide();
$('.container').removeClass('job_white_wrap');
$('.container').addClass('job_inv_wrap');
$('.error_div').show();
}
$('.line_loader').hide();
}
});
}
});
У меня еще есть вот такой инпут для загрузки файла:
<input type="file" file-maxsize="2048" file-accept="pdf, doc, docx, txt, rtf" name="file_cv" />
В нете я видел вот такие примеры:
http://javascript.ru/blog/gordon-fre...fajl-javascrip но там нет других данных кроме файла.
Вот еще такой видел вариант:
var formData = new FormData();
formData.append("file", file);
xhr.send(formData);
Но в нем тоже нет других данных, где в нем провести валидацию отдельных полей?
Хочу что бы все это дело ушло на сервер одним запросом.
Подскажите как мне это реализовать.