Отправка формы по Ajax: различия между версиями
Перейти к навигации
Перейти к поиску
Misha (обсуждение | вклад) Новая страница: «<pre> var $form = $('#form_brifada'); $form.submit(function(event) { event.preventDefault(); // Для того, что бы форма не отправлял…» |
Misha (обсуждение | вклад) Нет описания правки |
||
Строка 16: | Строка 16: | ||
}); | }); | ||
}); | }); | ||
</pre> | |||
Еще один вариант | |||
<pre> | |||
$('.send-ajax').submit(function(e) { // Форма отправляется при классе send-ajax | |||
e.preventDefault(); // Зпрещаем отправку по кнопке | |||
$("input").removeAttr("disabled"); // Убираем атрибут disable у input (иначе такие данные не отправятся) | |||
var form = $('.send-ajax').get(0); // You need to use standard javascript object here | |||
if($("table").is('.datatable') == true) // Если используется js библиотека datatable и intut поля в ней, | |||
{ // то делаем сериализацию полей данных в таблице и преобразуем в FormData | |||
var data = new FormData(form); // Сначала преобразуем поля вне таблицы | |||
var other_data = table.$('input,select,textarea').serializeArray(); | |||
$.each(other_data,function(key,input) | |||
{ | |||
data.append(input.name,input.value); // Добавляем поля из таблицы | |||
}); | |||
} else var data = new FormData(form); // Если таблицы нет, то делаем просто FormDana | |||
if($("#editor").length) // Если используется CKEDITOR, то добавляем данные из него. | |||
{ | |||
if(CKEDITOR.instances['editor'] != undefined) | |||
{ | |||
data.append('content', CKEDITOR.instances['editor'].getData()); | |||
} | |||
} | |||
//var fd = new FormData(form); | |||
// console.log($); | |||
$.ajax({ | |||
cache: false, | |||
processData: false, // tell jQuery not to process the data | |||
contentType: false, // tell jQuery not to set contentType | |||
method: 'POST', // Метод отправки формы | |||
//type: $(this).attr('method'), | |||
url: $(this).attr('action'), // Url, куда отправляется форма | |||
data: data // Данные формы | |||
}).done(function(data) { | |||
$('.disabled').prop('disabled', true); // Добавляем атрибут disable к инпутам с классом disable | |||
var out = JSON.parse(data); | |||
}).fail(function() { | |||
console.log('fail'); | |||
}); | |||
}); | |||
</pre> | </pre> |
Версия от 23:24, 23 ноября 2019
var $form = $('#form_brifada'); $form.submit(function(event) { event.preventDefault(); // Для того, что бы форма не отправлялась по кнопке $.ajax({ url: $form.attr('action'), // Данные для формы берутся из ее параметров type: $form.attr('method'), data: $form.serialize(), // возвращает строку пригодную для передачи через URL строку success: function(data) { // При успешном выполнении, обрабатываем пришедшие данные data = JSON.parse(data); // data - данные пришедшие в json формате //console.log(data); }, error: function() { alert('Произошла неизвестная ошибка. Попробуйте позже'); } }); });
Еще один вариант
$('.send-ajax').submit(function(e) { // Форма отправляется при классе send-ajax e.preventDefault(); // Зпрещаем отправку по кнопке $("input").removeAttr("disabled"); // Убираем атрибут disable у input (иначе такие данные не отправятся) var form = $('.send-ajax').get(0); // You need to use standard javascript object here if($("table").is('.datatable') == true) // Если используется js библиотека datatable и intut поля в ней, { // то делаем сериализацию полей данных в таблице и преобразуем в FormData var data = new FormData(form); // Сначала преобразуем поля вне таблицы var other_data = table.$('input,select,textarea').serializeArray(); $.each(other_data,function(key,input) { data.append(input.name,input.value); // Добавляем поля из таблицы }); } else var data = new FormData(form); // Если таблицы нет, то делаем просто FormDana if($("#editor").length) // Если используется CKEDITOR, то добавляем данные из него. { if(CKEDITOR.instances['editor'] != undefined) { data.append('content', CKEDITOR.instances['editor'].getData()); } } //var fd = new FormData(form); // console.log($); $.ajax({ cache: false, processData: false, // tell jQuery not to process the data contentType: false, // tell jQuery not to set contentType method: 'POST', // Метод отправки формы //type: $(this).attr('method'), url: $(this).attr('action'), // Url, куда отправляется форма data: data // Данные формы }).done(function(data) { $('.disabled').prop('disabled', true); // Добавляем атрибут disable к инпутам с классом disable var out = JSON.parse(data); }).fail(function() { console.log('fail'); }); });