jqueryを使用してチェックボックスのボタンの属性を交換できません

Question

jqueryを使用して、チェックボックスの選択/非選択時にボタンを有効/無効にしています。 1つのレコードだけを削除する「削除」と、選択されたすべてのレコードを削除する「複数削除」の2つのボタンセットがあります。

問題は、「削除」ボタンが無効（唯一のスタイル）のチェックボックスをオンにしても機能していることです。チェックボックスをオフにすると、「複数削除」ボタンが嫌になり（スタイルのみ）、「削除」ボタンで戻ることができなくなります。私はマテリアライズを使用しています。次のように

コードは次のとおりです。

HTMLコード：

@foreach($engines as $engine) 
    <td> 
     <a class="waves-effect waves-light btn red modal-trigger searchDelete" href="#searchDelete" data-id="{{$engine->id}}" data-name="{{$engine->name}}">Delete</a> 
    </td> 
    <td> 
     <div class="row"> 
      <div class="switch"> 
       <label> 
        <input type="checkbox" name="ids" class="id-search" value="{{$engine->id}}"> 
        <span class="lever"></span> 
       </label> 
      </div> 
     </div> 
    </td> 
@endforeach 

のjQueryコード：

$('.id-search').on('change',function() { 
var ids = []; 
$('input:checkbox[name=ids]:checked').each(function() { 
    ids.push($(this).val()); 
}); 
var length = ids.length; 
if (length > 0) { 
    $('#deleteMultipleSearch').attr('class','btn waves-effect waves-light red modal-trigger'); 
    $('.searchDelete').attr('class', 'btn disabled'); 
    $('.searchDelete').removeAttr('class', 'modal-trigger searchDelete'); 
    console.log("Id clicked"); 
} 
else { 
    $('#deleteMultipleSearch').attr('class', 'btn disabled'); 
    $('.searchDelete').removeAttr('class', 'btn disabled'); 
    $('.searchDelete').attr('class', 'btn red'); 
} 
}); 

Answer 1

私は問題はあなたがjQueryのaddClassとremoveClass APIのを使用する必要があることだと思いますattrおよびremoveAttrの代わりにクラスを操作するための... はこのJavaScriptコード

$('.id-search').on('change',function() { 
    var ids = []; 
    $('input:checkbox[name=ids]:checked').each(function() { 
     ids.push($(this).val()); 
    }); 
    var length = ids.length; 
    if (length > 0) { 
     $('#deleteMultipleSearch').addClass('btn waves-effect waves-light red modal-trigger'); 
     $('.searchDelete').addClass('btn disabled'); 
     $('.searchDelete').removeClass('modal-trigger searchDelete'); 
     console.log("Id clicked"); 
    } 
    else { 
     $('#deleteMultipleSearch').addClass('btn disabled'); 
     $('.searchDelete').removeClass('btn disabled'); 
     $('.searchDelete').addClass('btn red'); 
    } 
}); 

幸運