jquery函數無法從webgrid中的新數據觸發事件

不完全確定如何標題這個問題，但實質上是我的問題是調用一個基於一個新元素的jquery函數，這個新元素被放到我的WebGrid中。但是，我的webgrid被填充切換單選按鈕。然後網格通過ajax調用獲取新數據。因此，沒有頁面刷新完成，我的元素存在於我的網格，但我的JavaScript不知道他們。jquery函數無法從webgrid中的新數據觸發事件

下面是我的一些代碼。

的WebGrid：

@grid.GetHtml(tableStyle: "table table-striped table-bordered", 
      headerStyle: "thead-default", 
      columns: grid.Columns(
       grid.Column("account_number", "Account Number", canSort: true), 
       grid.Column("last_name", "Last Name", canSort: true), 
       grid.Column("first_name", "First Name", canSort: true), 
       grid.Column("middle_name", "Middle Name", canSort: true), 
       grid.Column("reject_reviewed", "Reviewed", canSort: true, format: (item) => Html.CheckBox("completed", (bool)(item.reject_reviewed == 1), new { disabled = "disabled" })), 
       grid.Column("comment", "Comments", format: (item) => 
        new HtmlString(
         Html.ActionLink("Add", "RejectAddComment", controller, new RejectCommentViewModel { reject_id = item.id, account_number = item.account_number, reject_message = item.reject_message }, 
          htmlAttributes: new { data_modal = "", id = "btnCreate", @class = "" }).ToString() 
            + " | " + 
         Html.ActionLink("View", "RejectViewComment", controller, new RejectCommentViewModel { reject_id = item.id, account_number = item.account_number, reject_message = item.reject_message }, 
          htmlAttributes: new { data_modal = "", id = "btnCreate", @class = "" }).ToString())), 
       grid.Column("reject_message", "Reject Message", canSort: true)))

的javascript：

$(function() { 

    $.ajaxSetup({ cache: false }); 

    $("body").on("click", 'a[data-modal]', function (e) { 

     // hide dropdown if any 
     $(e.target).closest('.btn-group').children('.dropdown-toggle').dropdown('toggle'); 


     $('#myModalContent').load(this.href, function() { 


      $('#myModal').modal({ 
       /*backdrop: 'static',*/ 
       keyboard: true 
      }, 'show'); 

      bindForm(this); 
     }); 

     return false; 
    }); 
}); 

function bindForm(dialog) { 

    $('form', dialog).submit(function() { 
     $.ajax({ 
      url: this.action, 
      type: this.method, 
      data: $(this).serialize(), 
      success: function (result) { 
       if (result.success) { 
        $('#myModal').modal('hide'); 
        //Refresh 
        location.reload(); 
       } else { 
        $('#myModalContent').html(result); 
        bindForm(); 
       } 
      } 
     }); 
     return false; 
    }); 
}

來源

2016-10-19 Jared

一行改成了這個

$("#scroll-grid").on("click", "#btnCreate", function (e)

和JavaScript事件現在觸發。

第一個元素必須是父元素，並且click事件之後必須是您正在查找事件的元素。

來源

2016-10-19 19:29:00 Jared

更改事件的結合：

$("a[data-modal]").on("click", function (e) {

要

$("body").on("click", 'a[data-modal]',function (e) {

，這是更好的使用比身體AA更好的選擇，像你網ID或類

通過，這是一個著名的問題的方式，googled

來源

2016-10-19 19:15:04

我會試試看。 – Jared

編輯了上面的JavaScript，但是我收到了相同的結果。 – Jared

你是否在控制檯中發現任何錯誤，或者它只是沒有觸發該事件？ –

jquery函數無法從webgrid中的新數據觸發事件

回答

相關問題