ブートストラップボタンを有効または無効にしたい。ページには4つのボタンがあります。ロード時に、最初のボタンが有効になり、残りは無効になります。これで、button1をクリックすると、ボタンの残りの部分が有効になり、button1が無効になります。
以下は私のコードです。最初のボタンを無効にできますが、残りのボタンは有効になりません。
$('document').ready(function() {
$("#add_resume1").on("submit", function(e) {
e.preventDefault;
var btn = $('#btn-save1');
// btn.button('loading');
$.ajax({
type: 'post',
url:$('form#add_resume1').attr('action'),
cache: false,
dataType: 'json',
data: $('form#add_resume1').serialize(),
beforeSend: function() {
$("#validation-errors").hide().empty();
},
success: function(data) {
if(data.success == false) {
var arr = data.errors;
$.each(arr, function(index, value) {
if (value.length != 0) {
$("#validation-errors").append('<div class="alert alert-danger"><strong>'+ value +'</strong><div>');
$('#basicdetails').val('');
$('#button.disabled[disabled=disabled]')
.removeClass('disabled')
.prop('disabled', false);
//.text('Click Me');
}
});
$("#validation-errors").show();
btn.button('reset');
} else {
$("#success").html('<div class="alert alert-success">Basic details saved successfully.<div>');
$('#basicdetails').val('');
$('#btn-save1').prop('disabled', true);
$('#button.disabled[disabled=disabled]')
.removeClass('disabled')
.prop('disabled', false);
}
},
error: function(xhr, textStatus, thrownError) {
//alert('Something went to wrong.Please Try again later...');
alert(thrownError);
btn.button('reset');
}
});
return false;
});
});
あなたのアドバイスをありがとう
編集
<button type="submit" class="btn btn-home" name= "btn-save5" id= "btn-save5" disabled="disabled" required="required">Save</button>
これはhtmlファイルのボタンコードです。htmlファイルはかなり大きいです。だから、私はあなたにボタンコードを与えるだけです。btn-save5、btn-save4、btn-save3mはこのように似ています。
ボタンを有効/無効にする最良の方法を尋ねました。だから私はジャンカのフィドルをフォークしています。
変更：
それらの無効化されたボタンに専用クラスを指定します。同様save-buttonの例では以下。そうしない$('button')と、DOM全体に影響します。
<button type="submit" class="btn btn-home save-button" name= "btn-save5" id= "btn-save5" disabled required="required">Save</button>
<button type="submit" class="btn btn-home save-button" name= "btn-save5" id= "btn-save4" disabled required="required">Save</button>
<button type="submit" class="btn btn-home save-button" name= "btn-save5" id= "btn-save3" disabled required="required">Save</button>
jQuery：
$('.btn.btn-home.save-button')
.removeClass('disabled')
.prop('disabled', false);
$('#add_resume1').prop('disabled', true);
});
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加