重新加载刷新Datatable后自动设定宽度 jquery datatable

功能需求是这样的:从下拉菜单中选择一个Item,然后弹出对话框显示所选项所属的一个数据列表。页面引用了jquery.ui以及jquery.datatable来实现这个功能,dialog中的button click事件来触发弹出一个新的对话框并加载datatable,为了避免重复初始化datatable(),代码改造为:

function initFacotoryVerificationDataTable(fCode) {
        var fvTable, url;

        url = "/FactoryVerification/GetAllFactoryVerificationListByPage?factoryitem=" + fCode;

        if (typeof fvTable == 'undefined' && fvTable != null) { //为了避免多次初始化datatable()

            fvTable.fnClearTable(0); //清空数据
            fvTable.fnDraw(); //重新加载数据
       //fvTable.fnAdjustColumnSizing(); //重新判断列宽度,实际执行并没有效果  }
else { fvTable = $('#fvTable').dataTable({ "bJQueryUI": true, "sScrollY": "100%", //"sScrollX": "100%", //"bAutoWidth": true, "bDestroy": true, "bSort": false, //"bInfo": true, //"bScrollCollapse": true, "bServerSide": true, "sPaginationType": "full_numbers", "sAjaxSource": url); } $(window).resize(function () { fvTable.fnAdjustColumnSizing(); }); }

咋一看,以上的代码并没有什么问题,也符合逻辑,但

fnAdjustColumnSizing()

没有触发执行实现自动判断列宽的功能,还好datatable有fnInitComplete方法,我们可以在数据加载完毕后执行

fnAdjustColumnSizing()
 else {
            fvTable = $('#fvTable').dataTable({
                "fnInitComplete": function() {
                this.fnAdjustColumnSizing(true);
                },
                "bJQueryUI": true,
                "sScrollY": "100%",

好了,达到功能需求!Yes!

转载于:https://www.cnblogs.com/Fred_Xu/archive/2013/01/11/column-width-not-refreshed-after-ajax-load.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值