Question

我是jQuery DataTables api的新手，我使用jQuery Datatables API在我的表中添加了一行。但是，该部分为什么不显示？我需要做些什么才能让它显示在我添加到表中的每一行？

感谢您的帮助！

<table width='200px' style="table-layout: fixed" id="downlink-table-nameserver" border>
  <thead>
    <td>Server Port WWN</td>
    <td>Server Node Name</td>
    <td>Server Port Name</td>
    <td>Server Node Name</td>             
  </thead>
  <tbody>
    <tr>
      <td>
        <label for="connection-state"> Connection State </label>
        <div id="connection-state"></div>
      </td>
    </tr>
  </tbody>  
</table>

使用Javascript：

$(document).ready(function() {
    //$('#example').dataTable();

    var serverPortWwnTitle = 'Server Port WWN',
    serverNodeWwnTitle = 'Server Node WWN',
    serverPortNameTitle = 'Server Port Name',
    serverNodeNameTitle = 'Server Node Name';     

    var linkOptions = {
        "bPaginate" : false,
        "bFilter" : false,
        "bInfo" : false,
        "bAutoWidth" : false,
        "aaData" : [],
        "aaSorting": [[ 1, "alphanumeric-asc" ]],
        "aoColumns" : [
            {
                "sTitle" : serverPortWwnTitle,
                "sWidth" : "230px",
                "mDataProp" : "serverPortWwn",
                "sType" : "string"
            }, {
                "sTitle" : serverNodeWwnTitle,
                "sWidth" : "230px",
                "mDataProp" : "serverNodeWwn",
                "sType" : "string"
            }, {                        
                "sTitle" : serverPortNameTitle,
                "sWidth" : "230px",
                "mDataProp" : "serverPortName",
                "sType" : "string"
            }, {
                "sTitle" : serverNodeNameTitle,
                "sWidth" : "230px",
                "mDataProp" : "serverNodeName",
                "sType" : "string"
            }                        
        ]
    };


    var nameSvrTable = $('#downlink-table-nameserver').dataTable(linkOptions);  

    var connMapInfo = [];             

    connMapInfo.push({
        serverPortWwn: "portwwn",
        serverNodeWwn : "nodewwn",
        serverPortName: "portname",
        serverNodeName: "nodename"
    });                               

    nameSvrTable.fnClearTable();                        
    nameSvrTable.fnAddData(connMapInfo);                               


} );

Answer 1

首先尝试使用正确的HTML标记。将<tr>添加到<thead>部分，然后在<th>内使用<td>代替<thead>。此外，<thead>和<tbody>部分中的单元格数应匹配，或使用colspan="4"来修复当前的标记问题。

<table width='200px' style="table-layout: fixed" id="downlink-table-nameserver" border>
<thead>
    <tr>
        <th>Server Port WWN</th>
        <th>Server Node Name</th>
        <th>Server Port Name</th>
        <th>Server Node Name</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td colspan="4">
            <label for="connection-state"> Connection State </label>
            <div id="connection-state"></div>
        </td>
    </tr>
</tbody>

这将是解决问题的良好开端。

jQuery DataTables没有出现

1 个答案: