フォームの送信時にJqueryの変更が無効にされたボタン

Question

フォームが有効な場合にのみ表示可能でなければならないボタンがあります。 私はこの書き込み：

function submit_form(){ 
var('#button2').attr('disabled',true); 
$.ajax({ 
    type : "POST", 
    data : $('#formset').serialize(), 
    success : function(json) { 
     console.log(json); 
     console.log("form sent!"); 
    }, 
    $('#button2').attr('disabled', false); 
    error : function(xhr,errmsg,err) { 
     console.log('error occured'); 
    } 
}); 

} が、それは動作しません。エラーはどこですか？

Answer 1

ちょうどあなたがprop

使用prop()に

を変更する必要がありますここではvar('#button2')

function submit_form(){ 
$('#button2').prop('disabled',true); 
$.ajax({ 
    type : "POST", 
    data : $('#formset').serialize(), 
    success : function(json) { 
     console.log(json); 
     console.log("form sent!"); 
     $('#button2').prop('disabled', false); 
    }, 

    error : function(xhr,errmsg,err) { 
     console.log('error occured'); 
    } 
}); 

Answer 2

最初の行にエラーのようですが、あなたが成功関数にボタンを配置しようとしたことがありますか？

function submit_form(){ 
var('#button2').attr('disabled',true); 
$.ajax({ 
    type : "POST", 
    data : $('#formset').serialize(), 
    success : function(json) { 
     console.log(json); 
     console.log("form sent!"); 
     $('#button2').attr('disabled', false); 
    }, 

    error : function(xhr,errmsg,err) { 
     console.log('error occured'); 
    } 
}); 

Answer 3

function submit_form(){ 
var('#button2').attr('disabled',true); 
$.ajax({ 
    type : "POST", 
    data : $('#formset').serialize(), 
    success : function(json) { 
     console.log(json); 
     console.log("form sent!"); 
    $("#button2").attr("disabled",false); 
// $("#button2").prop("disabled",false); 
// can use prop instead of attr 

}, 
    error : function(xhr,errmsg,err) { 
     console.log('error occured'); 
    } 
}); 

Answer 4

これを試してみてください。

ajaxリクエストが正常に完了したかどうかにかかわらず、常にボタンを有効にする必要があります。

function submit_form() { 
    $('#button2').prop('disabled',true); 
    $.ajax({ 
     type : "POST", 
     data : $('#formset').serialize(), 
     success : function(json) { 
      console.log(json); 
      console.log("form sent!"); 
     }, 

     error : function(xhr,errmsg,err) { 
      console.log('error occured'); 
     }, 

     complete: function() { 
     $('#button2').prop('disabled', false); 
     } 
});