Как предотвратить отправку формы JEditable в браузерах Webkit

Используя плагин JEditable JQuery, в Firefox все работало нормально. Однако в Chrome всякий раз, когда я выбирал что-то из раскрывающегося списка JEditable или нажимал Enter при редактировании текстового поля JEditable, форма, которую JEditable создает на лету, отправлялась, и вся моя страница обновлялась. Я не хотел, чтобы это произошло, так как я настроил его для вызова пользовательской функции, которая выполняет вызов Ajax для выполнения обновления. Как предотвратить отправку формы JEditable при изменении значения одного из входных данных формы?

Насколько я понял из онлайн-исследований, это проблема браузера Webkit, а не только проблема Chrome, поскольку кажется, что браузеры на основе Webkit автоматически отправляют формы при изменении входных данных в форме.


google-chrome form-submit webkit jeditable
person Justin    schedule 06.07.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

После долгих проб и ошибок я нашел один из способов обойти это — использовать функцию привязки JEditable. Функция привязки дает вам доступ к форме, которую создает JEditable, и с ее помощью вы можете перехватить событие onsubmit.

Итак, сначала создайте функцию для переопределения события onsubmit формы.

var bindSubmitDisableWebkitSubmission = function(settings, self){

        $('form', self).attr("onsubmit", "return false;");
    }

Затем привяжите эту функцию к различным событиям JEditable, которые вы не хотите отправлять в форму.

$.editable.types['select'].plugin = bindSubmitDisableWebkitSubmission;

Обратите внимание, что использование preventDefault и возврат false (см. ниже) не сработало.

function bindSubmitDisableWebkitSubmission (settings, self) {
         $('form', self).submit(function(e){
            e.preventDefault();
            return false;
        });
    }
person Justin    schedule 06.07.2015