排序或分页后,javascript 无法在 MVC webgrid 中工作

Raj*_*mar 2 asp.net-mvc jquery webgrid

我是 MVC 的新手,正在尝试完善webgrid. 我有以下代码view

@model IEnumerable<MVCMovies.Models.Movie>
@{
  ViewBag.Title = "Index";      

 }
 <script type="text/javascript">
 $(function() {
    $('tbody tr').on('hover', (function () {
        $(this).toggleClass('clickable');
    }));
    $('tbody tr').on('click', (function () {
        alert('rajeev');
    }));
});
</script>
 <style type="text/css">
   .table {
   margin: 4px;
    width: 100%;
    background-color: #FCFCFC;
}

.head {
    background-color: #11E8CD;
    font-weight: bold;
    color: #CC6699;       
}

.webGrid th, .webGrid td {
    border: 1px solid #C0C0C0;
    padding: 5px;
    color:white;
}

.altRow {
    background-color: #E4E9F5;
    color: #000;
}

.gridHead a:hover {
    text-decoration: underline;
}

.description {
    width: auto;
}

.selectRow {
    background-color: #0B7BEB;
}
.clickable {
    cursor: pointer;
    background: #ffff99;
}
</style>
<p>
   @Html.ActionLink("Create New", "Create")
</p>
<div>
  @using (Html.BeginForm())
  {
    @Html.AntiForgeryToken()
    <div style="float:left">Title : @Html.TextBox("SearchString")<br />         </div>
        <div style="float:left; padding-left:5px">
        <input type="button" value="Filter" class="btn" />
    </div>
    }
 </div>
  <div id="grid">
     @{
     var gd = new WebGrid(Model, rowsPerPage: 2, ajaxUpdateContainerId: "grid");
        @gd.GetHtml(tableStyle: "table");
   }

 </div>


     @section Scripts {
   @Scripts.Render("~/bundles/jqueryval")
}
Run Code Online (Sandbox Code Playgroud)

现在我有 jquery 编写的代码用于单击行功能,但在我排序或在 webgrid 中进行分页后它停止工作

Tat*_*aka 6

ajaxUpdateCallback 是服务器调用完成后将调用的 javascript 函数的名称。这将允许您在分页或排序后调用 jQuery 函数。

 @ { var grid = new WebGrid(data, ajaxUpdateContainerId : "grid", 
            ajaxUpdateCallback: "callBack");
   }
Run Code Online (Sandbox Code Playgroud)

  • 这是处理和绑定事件的最佳过程。很好的努力和答案 (2认同)