数据表Javascript链接无法在第二页上运行

时间:2015-04-01 15:48:56

标签: javascript jquery jquery-datatables

我在表格中有一个数据列表,并使用dataTable插件进行分页。

但是,我的上一栏是一个链接。当我转到第二页时,我无法点击该链接,但该链接仅在该表的第一页打开。

当我没有数据表所有链接的工作,但是当我添加它时,它没有工作......

我的代码:

 <table id="PartsResultListGrid" class="table table-striped table-bordered">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.PartsRequestOrderNum)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Call_Num)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.DetailView)
            </th>

        </tr>
    </thead>

    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.PartsRequestOrderNum)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Call_Num)
                </td>

                <td>
                    <div data-callno='@item.PartsRequestOrderNum' data-url="@Url.Action("GetPartsInfo", "Parts")">
                        <div class="PartsViewSubmit toolbarIcon">
                            <div class="toolbarIconText">View</div>
                        </div>
                    </div>
                </td>
            </tr>
        }
    </tbody>

</table>

使用Javascript:

<script type="text/javascript">
$(document).ready(function () {
    $('#PartsResultListGrid').dataTable({
        "bSort": false,
    });
});
</script>

知道为什么会这样吗?

我在这里的ajax链接打开链接:

        $('.PartsViewSubmit').click(function () {
        $.ajax({
            type: "GET",
            url: $(this).parent().data("url"),
            data: { PartsRequestOrderNum: $(this).parent().data("callno") },
            success: function (data) {
                $("#PartsDetail").html(data);
            },
        });
    });

1 个答案:

答案 0 :(得分:2)

您需要使用delegated event

  

委派事件的优势在于它们可以处理来自的事件   稍后添加到文档中的后代元素。通过   选择一个保证在当时存在的元素   委托事件处理程序附加,您可以使用委托事件   避免频繁附加和删除事件处理程序。

所以在你的情况下,我会这样做:

$(document.body).on('click', '.PartsViewSubmit', function() {
    $.ajax({
        ...
    });
});