Как отправить форму со многими полями с jQuery?
JavaScript может иметь наследование, проверить URL ниже:
http://www.webreference.com/js/column79/
Andrew
7 ответов
Каковы ваши аргументы в пользу этого предположения? POST предназначен для передачи больших объемов данных, чем GET. Запрос AJAX POST почти такой же, как и «обычный» запрос POST, он просто объединяется и обрабатывается внутри браузером немного по-другому. Пара заголовков может немного отличаться, но данные все те же. Почему AJAX не может обрабатывать "большую" форму?
Что бы вы вообще назвали "большой" формой?
Редактировать: Спасибо за разъяснение по вашему вопросу. Я понимаю, о чем вы сейчас спрашиваете, и понимаю, откуда вы. Для формы с большим количеством входных данных было бы сложно постоянно объединять ее в запрос Ajax.
Поскольку вы используете jQuery, есть простое решение. Ознакомьтесь с методом serialize () . Вы даете ему форму, и он возвращает вам строку запроса всех элементов ввода и значений формы, которые вы можете передать непосредственно в запрос ajax. На странице руководства есть пример, показывающий, как это делается.
Все, что вам нужно сделать, это:
$.ajax({
data: $("form").serialize(),
//etc.
});
где «форма» - это идентификатор вашей формы.
Вы, вероятно, захотите использовать serialize , если не хотите вручную обрабатывать каждый элемент.
$.ajax({
type: "POST",
url: "form.php",
data: $("#form_id").serialize()
success: function(msg) {
alert("Form Submitted: " + msg);
}
});
Вы можете использовать jQuery.post (url, data, callback, type) , так как проще jQuery.ajax (options) .
Используя сериализовать , вы можете отправить всю форму автоматически.
$.post("/post_handler/",
$("form#my_form").serialize(),
function(json){
/*your success code*/
}, "json");
Более полный пример:
<script>
$().ready(function(){
$("form#my_form submit").click(function(){
$.post("/post_handler/",
$("form#my_form").serialize(),
function(json){
/*your success code*/
}, "json");
return false;
});
}
</script>
<form id="my_form" action="/post_handler/" method="post">
<input type="text" name="text1" value="my text 1" />
<input type="text" name="text2" value="my text 2" />
<input type="submit" name="submit_button" value="Send" />
</form>
Это переопределит стандартное сообщение и выполнит его с помощью AJAX.
Если вы еще не пробовали. Затем создайте БОЛЬШУЮ форму (теперь все, что вы имеете в виду) и используйте $. Ajax () или плагин jQuery Forms, чтобы опубликовать ее. Вы узнаете, подходит это для такого рода вещей!
РЕДАКТИРОВАТЬ: - (после вашего редактирования) Тогда плагин форм для вас! Попробуйте.
Я отправил довольно сложные (большие) формы с помощью $ .ajax (), и проблем не возникло. Я не отправлял файлы через запросы ajax, но видел, как это делалось, и он работает лучше, чем традиционные сообщения, потому что он не связывает браузер во время загрузки.
Основываясь на вашем комментарии к @zombat, я предполагаю, что у вас очень большое количество входных данных, большинство из которых большую часть времени будут пустыми. Здесь два предложения: 1) разделите входные данные на отдельные формы и отправляйте каждую только после того, как она будет нажата / заполнена. 2) проверьте состояние вашей формы с помощью JavaScript и оберните информацию в JSON или XML, и вместо публикации данных формы разместите только структуру данных.
"Большой" не должно быть проблемой,
То, о чем вы спрашиваете, нетрудно. Все, что вам нужно сделать, это собрать содержимое формы и передать его на свой сервер (обычно используя JSON).
Взгляните на это руководство:
http://code.tutsplus.com/tutorials/submit -a-form-without-page-refresh-using-jquery - net-59