AjaxSubmit не является функцией перезагрузки DOM

У меня есть этот код ниже.

$('body').on('submit', '.some-form', function (event) {
    $(this).ajaxSubmit({
        dataType: 'json',
        success: function (data, statusText, xhr, form) {
            var url = 'some/url';

            // Reload the form markup/DOM using the response
            $.ajax({
                dataType: 'html',
                type: 'get',
                url: url
            }).done(function (html) {
                // get markup from url and replace the form markup ...    
            });
        },
        error: function () {
            alert('error');
        }
    });

    return false; 
});

По сути, я здесь делаю

  1. отправить и обработать форму
  2. получить результаты
  3. в случае успеха получить новую разметку формы со страницы, а затем заменить текущую разметку формы. если сбой, показать ошибку

Теперь, поскольку я делегировал событие отправки телу, проблем с обработкой отправки во вновь загруженной разметке формы возникнуть не должно.

Обработчик функции работает нормально, пока я не увижу эту ошибку

TypeError: $(...).ajaxSubmit is not a function

error: function () {

Есть идеи, почему это произошло? Это означает, что ajaxSubmit не существует, но я не перезагружал страницу.

РЕДАКТИРОВАТЬ: Да, я использую плагин формы jquery


javascript forms jquery ajaxform
person developarvin    schedule 26.06.2014    source источник
comment
Вы загрузили плагин jQuery Form?   -  person Barmar    schedule 27.06.2014
comment
malsup.com/jquery/form   -  person Barmar    schedule 27.06.2014
comment
В самом деле, мои мысли были о том, откуда, черт возьми, исходит функция ajaxSubmit.   -  person Jamie Hutber    schedule 27.06.2014
comment
Зачем нужен ajaxsubmit? JQuery Ajax может сделать то же самое.   -  person STEEL    schedule 27.06.2014
comment
@STEEL Потому что мне нужно загружать файлы через Ajax.   -  person developarvin    schedule 27.06.2014
comment
Итак, он работает один раз, но когда вы отправляете снова, вы получаете сообщение об ошибке?   -  person HMR    schedule 27.06.2014
comment
Когда я нажимаю на новую разметку, загруженную через JS, я получаю эту ошибку.   -  person developarvin    schedule 27.06.2014

Ответы (1)


arrow_upward
0
arrow_downward

Мои деньги идут на следующее:

В вашем запросе на HTML:

// get markup from url and replace the form markup ...

вы загружаете полную страницу, содержащую библиотеку jQuery. Когда вы это сделаете, новый скрипт jQuery в ответе HTML будет загружен, проанализирован и выполнен, и он перезапишет текущий прототип jQuery, что означает, что jQuery.ajaxSubmit больше не доступен.

Довольно умно, а?

Лучший способ решить эту проблему - просто не запрашивать полную страницу, содержащую скрипт jQuery, вместо этого запрашивать URL-адрес, который содержит только ту структуру DOM, которую вы хотите, а не всю страницу, включая заголовки, нижние колонтитулы, сценарии и т. Д.

person Adam    schedule 27.06.2014
comment
Мне кажется, что я уже этим занимаюсь. Страница, которую я вызываю, не содержит посторонних данных, таких как верхние и нижние колонтитулы или макет. - person developarvin; 27.06.2014
comment
Хорошо, но я могу гарантировать вам, что если вы посмотрите на вкладку своей сети, то увидите, что новый скрипт jQuery загружается после того, как вы выполните свой запрос в первый раз. Попробуйте это console.log($) и console.log($.fn) перед своим $(this).ajaxSubmit() - в этот раз вы впервые увидите, что ajaxSubmit является методом объекта $.fn, а во второй раз вы этого не сделаете, но когда вы console.log($), он должен выглядеть так же. Это означает, что ваш $.fn был переопределен где-то после первого запроса, но до второго запроса, что означает, что $ .ajaxSubmit больше не будет доступен. - person Adam; 27.06.2014