我有一个无限滚动的数据表表,没有分页。当用户单击一行时,我插入一个包含详细信息的子行,并将单击的行滚动到顶部。
这一切都很完美。
但是,我在子行上有一个按钮,显示一个bootstrap模式 当用户解除模态时,dataTables_scrollBody的offset()和scrolltop()值设置为零。 这会导致数据表滚动不正确。
所以我在显示模态之前保存了值。然后在隐藏模型后,我尝试将偏移和scrolltop设置为保存的值。 我没有得到错误,但值保持为零。
以下是我用来滚动网格的代码:
var container = $('#MainContent_grdBrowse,div.dataTables_scrollBody');
var scrollTo = $('.shown');
container.animate({
scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop()
});
以下是恢复值的代码:
container.offset({ top: dt_OffSetTop, left: dt_OffSetLeft });
container.scrollTop(dt_Scrolltop);
我在Firefox&amp ;;中得到了相同的结果IE。
编辑: 这是我保存的代码,并恢复值。
我将值保存到datatables click事件中的隐藏字段:
document.getElementById('MainContent_dt_OffSetTop').value = container.offset().top;
document.getElementById('MainContent_dt_OffSetLeft').value = container.offset().left;
document.getElementById('MainContent_dt_Scrolltop').value = container.scrollTop();
document.getElementById('MainContent_rw_OffSetTop').value = scrollTo.offset().top;
document.getElementById('MainContent_rw_OffSetleft').value = scrollTo.offset().left;
我恢复hidden.bs.modal事件中的值:
$('#ModalDisplayNotes').on('hidden.bs.modal', function (e) {
var dt_OffSetTop = document.getElementById('MainContent_dt_OffSetTop').value;
var dt_OffSetLeft = document.getElementById('MainContent_dt_OffSetLeft').value;
var dt_Scrolltop = document.getElementById('MainContent_dt_Scrolltop').value;
var rw_OffSetTop = document.getElementById('MainContent_rw_OffSetTop').value;
var rw_OffSetleft = document.getElementById('MainContent_rw_OffSetleft').value;
var container = $('#MainContent_grdBrowse,div.dataTables_scrollBody');
var scrollTo = $('.shown');
container.offset({ top: dt_OffSetTop, left: dt_OffSetLeft });
container.scrollTop(dt_Scrolltop);
scrollTo.offset({ top: rw_OffSetTop, left: rw_OffSetleft });
})
我保存时显示了这些值并且它们是正确的。我显示了hidden-bs-modal事件中隐藏字段返回的值,它们是正确的。然后我将值设置为数据表主体。然后,当我从数据表主体查询值时,它们为零。