Jquery ajax button clickイベントの発射？

Question

私は、従業員ページに編集オプションを持つ従業員のリストを表示しています。編集ボタンjquery-ajaxをクリックすると、サーバーからデータを取得します。 問題は、イベントが2回発生している編集ボタンをクリックしたときです。

私は別個のjsファイルを使用していて、ファイルをメインページに参​​照しています。スクリプトは別のjsファイルに移動するまで問題なく動作していました。

jQueryのスクリプトは、あなたが二回$.ajaxを呼び出す

//ajaxGet on edit button click 
$(document).on('click', '.editRole', ajaxGet); 

var ajaxGet = function (e) {  


    var spinner = $(this).parent('div').find('.spinner'); 
    var href = $("#editMenuSettings").data("url"); 
    var menuRoleId = $(this).data('id'); 

    spinner.toggle(true); 

    var options = { 
     type: "GET", 
     url: href, 
     data: { menuRoleId: menuRoleId } 
    }; 

    $.ajax(options).success(function (data) { 
     spinner.toggle(false); 
     $(".modal-body").html(data); 
     $(".modal").modal({ 
      backdrop: 'static' 
     }); 
    }); 

    $.ajax(options).error(function (data) { 
     spinner.toggle(false); 
     toastr.error("Oops..Some thing gone wrong"); 
    }); 

    return false; 

}; 

Answer 1

です。ライン

$.ajax(options).success(function(data)... 

$.ajax(options).error(function(data)... 

で

あなたは実際に2 異なる AJAX呼び出しを行う - 1 errorコールバックを持つだけで、別のコールバックsuccessとします。あなたのケースでは

、あなたの呼び出しは次のようになります。

var options = { 
    type: "GET", 
    url: href, 
    data: { menuRoleId: menuRoleId } 
}; 

$.ajax(options) 
    .success(function (data) { 
     spinner.toggle(false); 
     $(".modal-body").html(data); 
     $(".modal").modal({ 
      backdrop: 'static' 
     }); 
    }) 
    .error(function (data) { 
     spinner.toggle(false); 
     toastr.error("Oops..Some thing gone wrong"); 
    }); 

return false; 

それは、単一 AJAXコールに両方のコールバックを設定し、このいずれかを実行します。