«Не определено oCol» с помощью Datatables и jQuery Ui Dialog

Question

У меня есть форма для поиска в реестре.Эта форма показывает информацию в jQuery Dialog, и внутри диалога я использую Datatables (Да, внутри диалога у меня есть вся таблица).Я генерирую TR и TD динамически с помощью PHP, а затем 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>

Заранее спасибо.

Answer 1

Это может происходить, потому что ваша таблица не структурирована правильно. Убедитесь, что есть thead и tbody. У меня была эта ошибка, и как только я добавил thead и tbody, она исчезла. Мои настройки не имели ничего общего с настройками в другом ответе - я не уверен, почему это сработало, как не для меня.

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

Answer 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, и не только при открытии диалога, но я не думаю, что это проблема здесь.

Answer 3

Плагин jQuery datatables требует, чтобы количество элементов в теге <tbody> соответствовало количеству <th> элементов в теге <thead> вашей таблицы.

Answer 4

$ ("# tRes"). DataTable ({"bPaginate": true, "bLengthChange": true, "bFilter": true, "bSort": true, "bInfo": true, "bAutoWidth": true,});

Удалите этот код со своей страницы и проверьте синтаксис настроек значений текстовых полей, тогда он будет работать нормально.