Просмотр полной версии : Отправка формы после ajax проверки
Здравствуйте.
Есть форма, при отправке которой отсылается ajax запрос.
Проблема в том, что либо обрабатывается форма, либо отсылается ajax. Одновременно никак не хочет работать.
Сейчас сделал так: есть переменная sendAjax = true в начале, и если sendAjax = true то отправка формы блокируется preventDefault, идет отправка ajax. После завершения ajax меняем sendAjax = false и инициируем опять отправку формы через $('#myform').submit(), таким образом, при sendAjax = false уже должна была бы отправляться форма, а ajax нет. Однако этого не происходит. Видимо не успевает пменяться переменная или хз что. Но при повторном клике оправки формы отправляется уже именно форма.
Как сделать, чтобы отправлялся ajax, и после его выполнения и сама форма выполнялась?
После проверки и ОК результата, отправлять форму .submit(), при этом если обработчик проверки установлен на событие onsubmit, то отключить обработку этого события.
после ОК результата отправляю .submit(), но обработчик проверки onsubmit не отключал.
сделал после ОК результата
$('#myform').unbind();
$('#myform').submit();
все равно не работает
проследил, когда после ОК ответа идет на форму, $("#myform").submit() ничего не происходит, и код дальше не выполняется...
в чем может быть причина?
но обработчик проверки onsubmit не отключал.
А надо
$('#myform').on('submit', .....)
и
$('#myform').off('submit', ....);
после ответа сервера, это разве объяснения требует?
переделал
$("#myform").on("submit", function() { функция проверки и вызова функции ajax});
на ОК ответе от ajax ставлю
$("#myform").off("submit");
$("#myform").submit();
так?
ничего не происходит
<?php
if($_POST) {
if($_POST['ajx']) exit('Y');
else print_r($_POST);
}
?>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
$(function() {
$('form').on('submit', function(e) {
e.preventDefault();
$.post(location, $(this).serialize()+'&ajx=1', function(d) {
if(!!d) {
alert(d);
$('form').off('submit').submit()
}
})
})
});
</script>
</head>
<body>
<form method="post">
<input name="a" value="2" />
<button>GO</button>
</form>
</body>
</html>
Работает?
ваш пример работает.
еще покопался, оказалось, форма может иметь разные поля, которые подгружаются сторонним сриптом.
в итоге, обработчик на форму вешается так:
$(document).ready(function(){
formCheck();
});
$(document).ajaxComplete(function() {
formCheck();
});
function formCheck(){
$('#myform').on('submit', function(event){
....
это как-то неправильно, да?
но иначе форма не видится после подгрузки полей. даже если поля не подгружали, без #(document).ready... все равно не видится...
Как было бы правильно сделать в данном случае, чтобы форма виделась после загрузки и дозагрузки страницы?
пробовал вешать
$(document).on('submit', '#myform', function(){}) но так не работает, при чем в ff пишет что на форме висит обработчик, в опере не висит, и в обоих случаях ничего не происходит
+ может из-за такой конструкции не работает off() и тд что хотелось бы? (ваш пример работает, но у меня такая конструкция на моей форме не работает...)
запихнул ajax внутрь обработки формы, а не отдельной функцией, и назначил обработчики как
$(document).ready(function(){
$('#myform').on('submit', function(event){formCheck(event); event.preventDefault();});
})
и все заработало
спасибо большущее за уделенное время :)
вновь по этой теме возникла проблема.
сайт, где это делается, использует jquery 1.8.3
у меня данный способ работает только если подключать jquery 1.9.0 (по крайней мерее после ее подключения работает).
Загвоздка в том, что поля формы обрабатываются еще скриптом сайта на 1.8.3, и при подключении 1.9.0 частично перестает работать.
Подскажите пожалуйста, как можно привести все к одному виду? В чем может быть проблема, что-то устарело, или конфликт?
на версии 1.9.0 клик - частично обрабатывается форма, отправляется ajax и отправляется форма
на версии 1.8.3 клик - полностью обрабатывается форма, отправляется ajax. Клик еще раз - отправляется форма.
(а должно быть все по одному клику)
поля формы обрабатываются еще скриптом сайта на 1.8.3, и при подключении 1.9.0 частично перестает работать.
Две библиотеки, это нельзя. Метод .on() появился в библиотеке с версии 1.7, и поддерживается и 1.8.3, и 1.9.0. А есть еще и метод .one(). Так что если об этом методе речь, то ищите свои баги, а если нечто иное, то нужны пояснения, ошибки...
метод .on()
просто непонятно, почему с 1.9.0 работает, а с 1.8.3 нет...
Проверяем утверждение:
1.8.3
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(function() {
$('button').on('click', function() {
alert(1)
})
});
</script>
</head>
<body>
<button>Show</button>
</body>
</html>
1.9.0
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
$(function() {
$('button').on('click', function() {
alert(1)
})
});
</script>
</head>
<body>
<button>Show</button>
</body>
</html>
Есть разница?
нашел из-за чего было, в родных скриптах форма тоже обрабатывалась, частично исправил, но возникла такая ошибка (вернулся в самое начало, можно сказать), что форма при первом клике шлет ajax, и только по второму обрабатывается сама. так и не понял, что конфликтует.
при этом в ajax на успешном ответе код .off() работает, а вот .submit() и далее уже нет, хотя alert объекта формы выводит object, то есть форма есть...
не подскажите, в чем может быть дело, почему может submit() не работать? Какие могут быть еще конфликты, или хотя бы куда копать?
(инспектор в ff на форме показывает только один, мой обработчик)
не подскажите, в чем может быть дело, почему может submit() не работать?
Подскажу - алгоритм ошибочный. Есть блок-схемы алгоритмов (https://ru.wikipedia.org/wiki/%D0%91%D0%BB%D0%BE%D0%BA-%D1%81%D1%85%D0%B5%D0%BC%D0%B0), знакомо? Берем листочек в клеточку и рисуем свой алгоритм:
1. Ставим обработчик на отправку формы.
2. Проверяем форму - если ОК, то отправляем, и если отправление успешное, то удаляем обработчик. Если проверка формы неудачная, то возврат.
Разберетесь с карандашиком на листочке, значит и реальный код будет гарантировано работать.
алгоритм рабочий, на чистом примере работает. конфликт с чем-то на сайте, а с чем - не могу определить. потому и спрашивал, куда смотреть
UPD нашел, еще один конфликт, плагин стилизации формы form-styler...
UPD плагин мудреный, была проверка изменения формы по ajax (если подгружается другая вкладка в форму - у нее тоже стили правил), там конфликт и был, похоже. оформил просто отправку формы не на нее саму, а на кнопку type=submit
vBulletin® v3.6.7, Copyright ©2000-2025, Jelsoft Enterprises Ltd. Перевод: zCarot