Подтвердить что ты не робот

Uncaught TypeError: Не удается прочитать свойство 'className' из undefined

В инструментах разработчика Google Chrome появляется следующая ошибка:

Uncaught TypeError: невозможно прочитать свойство 'className' из undefined

Код, на который выдается ошибка:

var oTable = $('#resultstable').dataTable({
                            "bAutoWidth" : true,
                            "iDisplayLength" : 10,
                            "bFilter" : false,
                            "bLengthChange" : false
                        });

resultstable - это идентификатор таблицы в html:

<table cellpadding="0" cellspacing="0" border="0" id="resultstable"
                    name="resultstable" class="display datatable">

Странно то, что после тега таблицы есть оператор if. Таблица работает отлично, и CSS отображается правильно, когда программа отправляется в раздел else if{}, но она выдает указанную выше ошибку и CSS не применяется, когда она находится в разделе if{}.

Помогите пожалуйста!

4b9b3361

ОТВЕТЫ

Ответ 1

Другой ответ поставил меня на правильный путь.

Более кратко, ошибка заключалась в том, что созданная таблица была неправильной.

Мои столбцы заголовков (внутри ада, конечно), не совпадали с моими столбцами строк (внутри тела)

В моей ситуации у меня было слишком много столбцов внутри заголовка.

Ответ 2

Другая возможная причина: если вы указываете больше столбцов в атрибуте "aoColumnDefs", чем в таблице есть "td".

var yourTable = $('#product-search-results-table').dataTable({
    // If you only have three columns in the HTML table, then this line will cause an error, because it lists four columns in "aoColumnDefs".
    "aoColumnDefs": [{ "bSortable": false, "aTargets": [0, 1, 2, 3] }]
});

Ответ 3

Datatables требует, чтобы ваша таблица html была идеальной. Я обнаружил, что получил эту ошибку, когда у меня не было равного количества <th> и <td>. Убедитесь, что у вас нет дополнительного заголовка.

Ответ 4

Я получил ту же ошибку, что и сейчас. Однажды я столкнулся с очень похожей ошибкой, используя библиотеку Chosen. Проблема заключалась в том, что (в случае Chosen) использовались идентификаторы с символами [], что путало Javascript между css-селекторами и идентификаторами (помните, что в CSS мы можем использовать [] для указания атрибутов).

В случае с DataTables, однако, я заметил, что сами DataTables script добавляли class = " " до первого элемента в каждом элементе tr внутри tbody.

Причина этого в том, что вывод HTML из php имел логическую ошибку. Код неисправности:

<?php
for ($currentRow = 0 ; $currentRow <= $query_length; $currentRow++) {
        ?>
        <tr>
        <?php
        list($job_id, $company_id, $job_title, $industry_id, $profession_int, $job_openings, $job_city, $job_salary_start, $job_end_date, $job_start_date, $job_skills, $company_name, $isConfidential, $job_experience_level) = dbRow($query_results, $currentRow);
      echo "<td class = \"detailed-job-row\">" . $job_title . "</td>";
      echo "<td class = \"detailed-job-row\">" . $company_name . "</td>";
      echo "<td class = \"detailed-job-row\">" . $industry_id . "</td>";
      echo "<td class = \"detailed-job-row\">" . $profession_int . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_openings . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_city . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_salary_start . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_end_date . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_start_date . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_skills . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_experience_level . "</td>";
      ?>
        </tr>
        <?php  
     } ?>
    </tbody>
  </table>
<?php
}
?>

В нижней части длинной длинной таблицы произошла ошибка, указывающая, что postgres не может перейти к строке 208. Это сказало мне, что мне нужно прекратить цикл в i - 1 или $currentRow - 1.

Следовательно, фиксированный рабочий код:

<?php
for ($currentRow = 0 ; $currentRow <= $query_length - 1; $currentRow++) {
        ?>
        <tr>
        <?php
        list($job_id, $company_id, $job_title, $industry_id, $profession_int, $job_openings, $job_city, $job_salary_start, $job_end_date, $job_start_date, $job_skills, $company_name, $isConfidential, $job_experience_level) = dbRow($query_results, $currentRow);
      echo "<td class = \"detailed-job-row\">" . $job_title . "</td>";
      echo "<td class = \"detailed-job-row\">" . $company_name . "</td>";
      echo "<td class = \"detailed-job-row\">" . $industry_id . "</td>";
      echo "<td class = \"detailed-job-row\">" . $profession_int . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_openings . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_city . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_salary_start . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_end_date . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_start_date . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_skills . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_experience_level . "</td>";
      ?>
        </tr>
        <?php  
     } ?>
    </tbody>
  </table>
<?php
}
?>

Выполнение этого изменения позволило корректно работать с DataTables.

Итак, хотя я не могу предоставить рабочее решение, я советую вам посмотреть на ваш html-разметку, поскольку это может быть источником вашей проблемы (например, имеет ли ваша таблица tbody?).

Ответ 5

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

$('.datatable').dataTable({
  aoColumnDefs: [
    {
      bSortable: false,
      aTargets: [0, 6]
    }
  ],
  aaSorting: []
});

Этот набор содержит 7 столбцов td, но их было всего 6. Измените его следующим образом:

$('.datatable').dataTable({
  aoColumnDefs: [
    {
      bSortable: false,
      aTargets: [0, 5]
    }
  ],
  aaSorting: []
});

Ответ 6

Он бросает эту ошибку, потому что когда dom сначала загружает, вы использовали до объявления.

для этой ошибки у меня было одно решение, написанное ниже:

вы можете добавить, если особый элемент условия не undefined, как показано ниже

if(document.getElementsByTagName('button') !== undefined){
  // and write your needed code here
}

Ответ 7

Обнаружена аналогичная проблема. Корневой случай состоял в том, что, хотя dataTable собирался взять под контроль таблицу, наш код также пытался манипулировать свойствами таблицы в одно и то же время. Сообщение об ошибке не говорит об этом, однако, как только таблица осталась управляемой только с помощью dataTable, проблема исчезла.