在 jquery 数据表初始化中动态设置行单击事件

Question

我正在使用调用控制器函数的 ajax 将数据加载到表中。选择新页面或对列进行排序时，我使用 ajax 将数据重新加载到相同的原始控制器函数中。这样我就不会立即加载所有项目，只在需要时加载。我想使每一行都有一个onclickjavascript函数，我可以在其中从单击的行中获取列信息。有什么想法吗？控制器函数只是根据用户想要查看的结果范围和排序顺序来获取我的数据。

我唯一的JavaScript代码如下：

<script>
    $(function() {
        var oTable;
        oTable = $('#tblItemModel').DataTable({
            "serverSide": true,
            "paginate": true,
            "ajaxSource": "/Finance/ItemListAjax",
            "processing": true,
            "serverMethod": "GET",
            "displayLength": 50
        });
    })
</script>

我的 html 如下：

<table class="table table-striped at-table" id="tblItemModel">
      <thead>
            <tr>
                <th>
                    Id
                </th>
                <th>
                     @Html.DisplayNameFor(model => model.Name)
                </th>
                <th>
                   @Html.DisplayNameFor(model => model.ListPrice)
                </th>
                <th>
                      @Html.DisplayNameFor(model => model.DiscountPrice)
                </th>
          </tr>
     </thead>
     <tbody class="mousechange"></tbody>
</table>

Answer 1

我通常以这种方式工作，以便在您连续单击时获取数据...

in dataTable（）

    $('#tblItemModel tbody').on('click', 'tr', function () {
       var pos = oTable.fnGetPosition(this);
       var row = oTable.fnGetData(pos);//row = It contains all the data in that row
    });

对于数据表（）

    $('#tblItemModel tbody').on('click', 'tr', function () {
       var pos = oTable.row(this).index();
       var row = oTable.row(pos).data();//row = It contains all the data in that row
    });