Question

放在“ JQuery UI对话框”中的Tabulator表打开时折叠（没有可见的行）。单击列标题后，表格将展开。我是否缺少设置？

这是针对ASP.Net Web应用程序的，该表在对话框中定义为。

下面的

CustomerDataSet是对象的JSON数组。单击表标题后打开表，数据映射似乎可以正常工作。

var patTable = new Tabulator("#ptlist-table", {
        selectable: 1,
        data: CustomerDataSet, 
        columns: [
            { title: "Name", field: "name" },
            { title: "Customer ID", field: "id" },
            { title: "Location", field: "location" },
            { title: "Detail", field: "detail" },
            { title: "Order date/time", field: "timestamp" },
        ],
    });

$("#dialog-id").dialog("open");  // The table shows inside the dialog.

我希望表格在对话框打开后能完整显示。相反，该表显示为折叠状态，直到我单击列标题为止。

Answer 1

如果初始化制表符所用的元素最初是隐藏的，则在显示patTable.redraw(true)后必须调用它。这是因为当元素被隐藏时，JavaScript的宽度和高度将返回0。

因此，当Tabulator初始化时，它对其内部元素的宽度和高度所做的所有计算都将不正确，并且该表将无法按您期望的方式呈现。如果您想研究这种情况，还有很多其他JS解决方法，但是我建议您只要求Tabulator自己重新绘制/重新渲染。

Answer 2

当对话框打开时，我可以通过编程方式单击表的列标题来解决该问题：

myDialog = $（“＃dialog-id”）。dialog（{ ... ... 打开：function（）{ $（“＃ptlist-table”）。find（“。tabulator-col”）。first（）。click（）; }， ...

jQuery UI对话框中的制表符表打开时折叠

2 个答案: