我在表格中有一个数据列表,并使用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);
},
});
});
答案 0 :(得分:2)
您需要使用delegated event:
委派事件的优势在于它们可以处理来自的事件 稍后添加到文档中的后代元素。通过 选择一个保证在当时存在的元素 委托事件处理程序附加,您可以使用委托事件 避免频繁附加和删除事件处理程序。
所以在你的情况下,我会这样做:
$(document.body).on('click', '.PartsViewSubmit', function() {
$.ajax({
...
});
});