отправить форму с помощью mootools

Question

Я создал класс, который обрабатывает загрузку и отправку HTML-формы.См. Код ниже

ND.Form = new Class({
    //--- Implements options og events.
    Implements: [Options, Events],

    //--- Options.
    options: {
        url: '',
        injectTo: ''
    },

    //--- Initialize the class.
    initialize: function (panel, options) {
        //--- Set options
        this.setOptions(options);
        this.panel = panel;
        this.loadForm();
    },

    loadForm: function () {
        var req = new Request.HTML({
            url: this.options.url,
            method: 'get',
            onSuccess: function (html) {
                $(this.options.injectTo).empty();
                $(this.options.injectTo).adopt(html);
                var formId = $(this.options.injectTo).getFirst('form').get('id');
                $(formId).addEvent('submit', function (e) {
                    e.stop();
                    this.submitForm(formId);
                } .bind(this));
            } .bind(this)
        }).send();
    },

    submitForm: function (formId) {
        $(formId).set('send', {
            onSuccess: function (resp) {
                this.panel.loadContent();
                if (resp != null) {
                    $('lbl_error').empty();
                    $('lbl_error').setStyles({ 'display': 'block', 'color': 'red' }).set('html', resp);
                }
            }.bind(this),

            onFailure: function (resp) {
                if (resp != null) {
                    $('lbl_error').empty();
                    $('lbl_error').setStyles({ 'display': 'block', 'color': 'red' }).set('html', resp);
                }
            }
        });
        $(formId).send();
    }
});

И все работает просто отлично, кроме того, что когда я нажимаю кнопку сохранения больше, чем "this.panel.loadContent ();"в «submitForm: function (formId)» срабатывает столько раз, сколько раз я нажал кнопку, как я могу предотвратить это?

/ Martin

Answer 1

Начиная с mootools 1.3 "set ('send')" добавляет еще одно событие. Так что вам нужно написать:

$('myForm').set('send', {
    onSuccess: function (html) {},
    onFailure: function(xhr){}
}).addEvent('submit', function(e){
    e.stop();
    this.send();
});

вместо:

$('myForm').addEvent('submit', function(e){
    e.stop();
    this.set('send', {
        onSuccess: function (html) {},
        onFailure: function(xhr){}
    });
}).send();

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

Answer 2

Basically we need to do three things:

1. Прослушайте событие 'click' на кнопке отправки.
2. Остановите событие при отправке формы.
3. Отправьте форму с помощью $ (formElement).send ()

Решение может выглядеть примерно так:

$('submit').addEvent( 'click', function(evt){
     // Stops the submission of the form.
     new Event(evt).stop();

     // Sends the form to the action path,
     // which is 'script.php'
     $('myForm').send();
    } );

Answer 3

Я использовал метод request.send (), но гуглил, пытаясь найти способ просто повторить действие пользователя, нажимающего кнопку отправки формы, но также позволяя заранее выполнить некоторую логику JavaScript. Я не нашел ничего в дискуссиях, конкретно касающихся этого. Ответ, который я нашел, заключается в использовании метода form.submit ().