“oCol 未定义”使用数据表和 jQuery Ui 对话框

Posted 2023-05-07

【中文标题】“oCol 未定义”使用数据表和 jQuery Ui 对话框

【英文标题】："oCol is Undefined" Using Datatables and jQuery Ui Dialog

【发布时间】：2011-09-18 07:48:16

【问题描述】：

我有一个表格，用于搜索注册表。此表单在jQuery Dialog 中显示信息，并且在对话框内部，我使用的是Datatables（是的，在对话框内部我有一个完整的表格）。我正在使用 php 动态生成 TR 和 TD，然后 PHP 将字符串粘贴到 html 中。 但是，当显示对话框时，我收到此错误：

oCol 未定义： oCol.fnSetData(oData, val);

我在 Firefox 和 Chrome 中尝试过，但结果是一样的。我也在http://www.datatables.net 中搜索过，我丢弃了一个“格式错误的表”。我不知道我做错了什么。

你能帮我解决这个问题吗？

这是我的 JS 块：

        <script type="text/javascript" language="javascript" src="lib/jQuery/jquery-1.6.1.js"></script>
        <script type="text/javascript" language="javascript" src="lib/jQuery Ui/js/jquery-ui-1.8.13.custom.min.js"></script>
        <script type="text/javascript" language="javascript" src="lib/Datatables/DataTables-1.8.0/media/js/jquery.dataTables.js"></script>
        <script type="text/javascript">
            $(document).ready(function ()
                $("#results").dialog(
                    title: "Results",
                    width: 900, 
                    height: 500,
                    open: function(event, ui)
                        $("#tRes").dataTable(
                            "bPaginate": true,
                            "bLengthChange": true,
                            "bFilter": true,
                            "bSort": true,
                            "bInfo": true,
                            "bAutoWidth": true
                        );
                    
                );
            );
        </script>

这是我的表格（带有 PHP 代码段）：

<div id="results">
    <table id="tRes">
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>State</th>
                <th>Address</th>
            </tr>
        </thead>
        <tbody>
            <?php 
                echo $rows;
            ?>
        </tbody>
    </table>
</div>

提前致谢。

【参考方案1】：

这可能是因为您的表格结构不正确。确保有thead 和tbody。我有这个错误，一旦我添加了 thead 和 tbody 它就消失了。我的设置与其他回复中的设置完全不同 - 我不确定为什么那个有效，因为它不适合我。

table
  thead
    tr
      th`s
  tbody
    tr`s
      td`s

【讨论】：

这个。当我在正文中添加一列但未能为其添加 th 时，我遇到了这个问题。

【参考方案2】：

您是否尝试过像这样设置您的列：

                    $("#tRes").dataTable(
                        "bPaginate": true,
                        "bLengthChange": true,
                        "bFilter": true,
                        "bSort": true,
                        "bInfo": true,
                        "bAutoWidth": true,
                     "aoColumns": [
                                        null,
                                        null //put as many null values as your columns

                    ]
                    );

如果这仍然不起作用，您能否也发布生成的 html？ 您可以考虑的另一件事是在 document.ready 上初始化表格，不仅是在您打开对话框时，而且我认为这不是问题所在。

【讨论】：

是的，你是对的。这解决了问题。谢谢（2 个月后）

只有在标题多于连续单元格的情况下，这才是解决方案，反之亦然，正确的解决方案是 thugsb。虽然它可以解决手头的问题，但它正在弥补裂缝。

如果我有 6 列，即<th>，但只有 4/6 是内容，即另外两个是按钮，我的 JSON 响应，即服务器端，返回一个 JSON 对象只有 4 个键值对。如何告诉数据表按原样显示其他 2 个 <td> 按钮，即不影响/重写/隐藏它们？

【参考方案3】：

jQuery 数据表插件要求 <tbody> 标记中的元素数量 与表格的<thead> 标记中<th> 元素的数量相匹配 .

【参考方案4】：

$("#tRes").dataTable( “bPaginate”：是的， “bLengthChange”：真， “bFilter”：真， “bSort”：是的， “bInfo”：是的， “bAutoWidth”：真， );

从您的页面中删除此代码并检查文本框设置值的语法，然后它将正常工作。