Как отключить / только чтение формы при обработке / отправке?

Question

Я использую AJAX для отправки форм.Я использую следующий код для отправки формы через AJAX.

jQuery('form.AjaxForm').submit( function() {        
        $.ajax({
            url     : $(this).attr('action'),
            type    : $(this).attr('method'),
            dataType: 'json',
            data    : $(this).serialize(),
            success : function( data ) {
                        for(var id in data) {   
                          jQuery('#' + id).html( data[id] );                                
                        }
                      }
        });
        return false;
    });

Вопрос:

Я хочу отключить / только чтение, пока сервер обрабатывает данные формы после отправки.Форма должна быть нормальной после отправки или любой ошибки.Несколько раз пользователь нажимает кнопку «Отправить» более одного раза, и мы получаем ненужные дубликаты записей в базе данных.

Есть идеи?

Спасибо

Answer 1

function disable() {
    return false;
}

// Disable form
jQuery('form.AjaxForm').bind( "submit", disable );

// Enable form
jQuery('form.AjaxForm').unbind( "submit", disable );

Или, если вы хотите предотвратить изменение входных данных:

// Disable
jQuery('form.AjaxForm input').each( function() {
    jQuery( this ).attr( "disabled", "disabled" );
});

// Enable
jQuery('form.AjaxForm input').each( function() {
    jQuery( this ).attr( "disabled", "" );
});

Answer 2

Отключите кнопку отправки перед вызовом $.ajax в обработчике отправки:

$('#yoursubmit').attr('disabled', 'disabled');

и включите ее снова в обработчиках $.ajax успеха / ошибок вызова:

$('#yoursubmit').attr('disabled', '');

Answer 3

Это отключит кнопку отправки при нажатии.

$('#myform').submit(function(){
      $('input[type=submit]', this).attr('disabled', 'disabled');
});