Событие отправки формы HTML потеряно, если DOM был изменен через AJAX - PullRequest
Новая
       5

Событие отправки формы HTML потеряно, если DOM был изменен через AJAX

1 голос
/ 10 августа 2010

У меня есть форма с полями ввода и кнопкой отправки.Наблюдается событие размытия каждого входа (с использованием прототипа), и запускается новый Ajax.Request для асинхронной проверки на стороне сервера.Текст ответа Ajax изменяет дерево DOM, обновляя тексты ошибок и стили ошибок.Все работает нормально, за исключением того, что когда я оставил какой-то элемент ввода, нажмите кнопку отправки, и DOM тем временем изменяется из-за ответа AJAX.не срабатывает, если DOM модифицируется посредством вызова AJAX.

Это код: 

document.observe("dom:loaded", function() { 
    $$('#customerForm input[type=text],#customerForm select').each(function(node){
        node.observe("blur",function(){
            var formData=$('customerForm').serialize(true);
            var fieldName=this.name;
            var fieldId=this.id;
            var errDivId=this.id+'_err';
            var errDiv=$(errDivId);
            var parent=$(errDiv.parentNode);
            formData['fieldName']=fieldName;
            new Ajax.Request(
                validateUrl, 
                {
                    method: 'post', 
                    parameters: formData,
                    onComplete:function(response){
                        var responseText=response.responseText;
                        responseText=responseText.strip();
                        errDiv.innerHTML=responseText;
                        if(responseText==""){
                            errDiv.removeClassName('errors');
                            parent.removeClassName('errors');

                        }
                        else{
                            errDiv.addClassName('errors');
                            parent.addClassName('errors');
                        }
                }
            });
        });
    });
});

Я что-то не так делаю?Или, если это ожидаемое поведение, есть ли обходной путь?Ожидаемый результат - отправка формы, независимо от того, был ли изменен DOM или нет после нажатия кнопки.

1 Ответ

1 голос
/ 28 декабря 2011

подсказка 1: старайтесь не обновлять весь DOM по запросам Ajax, это лучшее отношение, только получать ответы JSON и помещать значения в сообщения об ошибках

подсказка 2: не знать о прототипе (никогда не использовал его) но jQuery имеет live () помимо стандартного bind (), который всегда прослушивает срабатывание события и уничтожается вызовом die () для того же элемента

надеюсь, это поможет любым способом

...