jQuery數據表-如何設置列名

Question

我有一個jQuery datable插入我的ASP.NET應用程序中，當前，為了顯示列名，我在Razor視圖中有以下代碼。

<table id="myDataTable" class="display">
    <thead>
        <tr>
            <th>Contact name</th>
            <th>Title</th>
            <th>Country</th>
            <th>City</th>
            <th>Project</th>
        </tr>
    </thead>
    <tbody style="font-size:x-small"></tbody>
</table>

然后，我有用於jQuery數據表的JavaScript ...

$('#myDataTable').DataTable({
        "bServerSide": false,
        "sAjaxSource": //controller binding,
        "bAutoWidth": false,
        "bProcessing": true,
        "aoColumns": [
            { "sName": "CONTACT_NAME" },
            { "sName": "TITLE"},
            { "sName": "COUNTRY" },
            { "sName": "CITY" },
            { "sName": "PROJECT" },
        ],
        "bDestroy":true
    });

但是，當我在填寫表格之前第一次呈現HTML時，它看起來很尷尬，因為我正在分發一些完全沒有數據表的隨機HTML（與將來的列名相關）...

如何定義表的列而不必在HTML中進行設置，這樣就可以避免在其中包含隨機文本？

謝謝！

Answer 1

只需將#myDataTable的初始CSS設置為#myDataTable visibility:hidden; 像這樣：

#myDataTable { visibility:hidden; }

這樣，您可以將其放在HTML中，並在更新值后調用以下JavaScript進行顯示：

document.getElementById('#myDataTable').style.visibility = "visible";