php 类型错误：使用 jQuery 数据表库时未定义 oColumn
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12280900/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
TypeError: oColumn is undefined When Using jQuery Datatables Library
提问by Iain Simpson
I am having a problem getting the jQuery Datatables library to show up properly on my Joomla website table. http://datatables.net
我在让 jQuery Datatables 库正确显示在我的 Joomla 网站表格上时遇到问题。 http://datatables.net
The script is half styling my table and then giving up (I am getting the table header colour changed and text colour, but no datatables controls etc).
该脚本对我的表格进行了一半的样式设置，然后放弃了（我正在更改表格标题颜色和文本颜色，但没有数据表控件等）。
Firebug is also throwing the following error:
Firebug 还抛出以下错误：
TypeError: oColumn is undefined
In my Joomla templates index.php I have the following in the <head>:
在我的 Joomla 模板 index.php 中，我有以下内容<head>：
<script src="./datatables/js/jquery.js" type="text/javascript"></script>
<script src="./datatables/js/jquery.dataTables.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function() {
jQuery('#staff_table').dataTable({
"bLengthChange": true,
"bFilter": true,
"bSort": true,
"bInfo": true,
"bAutoWidth": true
} );
} );
</script>
The HTML / PHP looks like this:
HTML/PHP 看起来像这样：
<h3>Members of Staff</h3>
<p>If you're looking for a member of staff at Tower Road Academy, you'll find their details here.</p>
<table class="staff_table" id="staff_table">
<tr class="staff_table_head">
<th>Name</th>
<th>Job Title</th>
<th>Email Address</th>
</tr>
<?php
$result = mysql_query("SELECT * FROM itsnb_chronoforms_data_addstaffmember");
while($row = mysql_fetch_array($result))
{
echo '<tr>';
echo '<td>' . $row['staff_name'] . '</td><td>' . $row['staff_job'] . '</td><td><a href=mailto:"' . $row['staff_email'] . '">' . $row['staff_email'] . '</a>' . '</td>';
echo '</tr>';
}
?>
</table>
回答by Hazem Salama
For datatable to work properly, your tables must be constructed with a proper <thead>and <tbody>tags.
要使数据表正常工作，您的表必须使用适当的<thead>和<tbody>标签构建。
All DataTables needs in your HTML is a
<TABLE>which is well formed (i.e. valid HTML), with a header (defined by a<THEAD>HTML tag) and a body (a<TBODY>tag)
HTML 中的所有 DataTables 都需要一个格式
<TABLE>良好（即有效的 HTML），带有标题（由<THEAD>HTML 标记定义）和正文（<TBODY>标记）
回答by Iain Simpson
Sorted it !, it turns out datatables is VERY strict about the html it accepts before it throws an error. I added tags to my html and now it is working, also note that you must have tags for your header columns and not tags as this also throws an error.
排序了！，结果数据表对它在抛出错误之前接受的 html 非常严格。我在我的 html 中添加了标签，现在它可以工作了，还要注意你的标题列必须有标签而不是标签，因为这也会引发错误。
The html code now looks like this :
html 代码现在看起来像这样：
<h3>Members of Staff</h3>
<p>If you're looking for a member of staff at Tower Road Academy, you'll find their details here.</p>
<table class="staff_table" id="staff_table">
<thead>
<tr class="staff_table_head">
<th>Name</th>
<th>Job Title</th>
<th>Email Address</th>
</tr>
</thead>
<?php
$result = mysql_query("SELECT * FROM itsnb_chronoforms_data_addstaffmember");
while($row = mysql_fetch_array($result))
{
echo '<tr>';
echo '<td>' . $row['staff_name'] . '</td><td>' . $row['staff_job'] . '</td><td><a href=mailto:"' . $row['staff_email'] . '">' . $row['staff_email'] . '</a>' . '</td>';
echo '</tr>';
}
?>
</table>
and calling the jquery etc looks like this :
并调用 jquery 等看起来像这样：
<script src="./datatables/js/jquery.js" type="text/javascript"></script>
<script src="./datatables/js/jquery.dataTables.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery('#staff_table').dataTable({
"bLengthChange": true,
"bFilter": true,
"bSort": true,
"bInfo": true,
"bAutoWidth": true
} );
} );
</script>
回答by Randika Vishman
Hope this would help you all, at least to get a hint out of it.
希望这对大家有所帮助，至少可以从中得到一些提示。
http://datatables.net/forums/discussion/comment/42607
http://datatables.net/forums/discussion/comment/42607
My problem was, TypeError: col is undefined.
我的问题是，TypeError: col 未定义。
Summarized Answer:
总结答案：
Number of TH elements within the TR element within the THead element of the Table MUST BE EQUAL to the Number of TD elements(or number of columns within your Table Rows) within the TR element(s) of your TBody in the Table.
表的 THhead 元素内的 TR 元素内的 TH 元素的数量必须等于表中 TBody 的 TR 元素内的 TD 元素的数量（或表行中的列数）。
You can read the explanation bellow:
你可以阅读下面的解释：
The problem was, I hadn't put enough Th or Td elements within the thead section to be equal to the number of columns which I print as Td elements inside the Tr elements within the TBody section.
问题是，我没有在 thead 部分中放置足够的 Th 或 Td 元素来等于我在 TBody 部分中的 Tr 元素内作为 Td 元素打印的列数。
Following code did give me the error.
以下代码确实给了我错误。
<thead>
<tr>
<th> Heading 1</th>
<th> Heading 2</th>
</tr>
</thead>
<tbody>
<tr>
<td> Column 1 </td>
<td> Column 2</td>
<td> Column 3</td>
</tr>
</tbody>"
But just adding one more Th element to the Tr element within the THead element made it works like a charm! :) And I got the hint from the above link.
但是，只需在 THhead 元素中的 Tr 元素中再添加一个 Th 元素，它就可以发挥作用！:) 我从上面的链接中得到了提示。
And also, I found that all the TH elements within the THead's Tr element could be TD elements too, as it's also valid HTML to the required level by the jQuery DataTables!
而且，我发现 THead 的 Tr 元素中的所有 TH 元素也可以是 TD 元素，因为它也是 jQuery DataTables 所需级别的有效 HTML！
Hope I helped some of you to save your time! :)
希望我能帮助你们中的一些人节省时间！:)
回答by Alessandro Minoccheri
Try this:
尝试这个：
jQuery('#staff_table').dataTable({
"bPaginate": true,
"bLengthChange": true,
"bFilter": true,
"bSort": true,
"bInfo": true,
"bAutoWidth": true,
"aoColumns": [
null,
null //put as many null values as your columns
]
});
