Как и в заголовке, у меня есть html-таблица, которую я форматирую с помощью плагина jQuery DataTables. Я также использую плагин YADCF для генерации отдельных функций сортировки столбцов.Плагин YADCF не загружается с помощью DataTables 1.10.7
Проблема заключается в том, что я не могу заставить любую функцию поиска отображаться в моем заголовке таблицы (или в нижнем колонтитуле). Я пытаюсь получить текстовое поле поиска под каждым столбцом в таблице.
Я использую DataTables v1.10.7 с YADCF v0.8.7 и jQuery 1.10.2.
Я включил YADCF CSS и файлы сценариев в моем HTML файле:
<link rel="stylesheet" href="lib/yadcf/jquery.dataTables.yadcf.css" />
<script src="lib/yadcf/jquery.dataTables.yadcf.js" ></script>
Они оба загрузки, как я проверил источник моей веб-страницы, и они видны там.
Моя таблица имеет следующую конфигурацию HTML:
<table id="myTable" class="table-hover table-bordered">
<thead>
<tr>
<td>Column 1</td>
<td>Column 2</td>
<td>Column 3</td>
<td>Column 4</td>
<td>Column 5</td>
<td>Column 6</td>
</tr>
</thead>
<tfoot>
<tr>
<td>Column 1</td>
<td>Column 2</td>
<td>Column 3</td>
<td>Column 4</td>
<td>Column 5</td>
<td>Column 6</td>
</tr>
</tfoot>
</table>
Моя конфигурация JavaScript выглядит следующим образом:
$(document).ready(initTable);
function initTable() {
var myTable = $('#myTable').DataTable({
"processing": true,
"serverSide": true,
"ajax": {
// config for data going to the server
"url": "/loadTable",
"method": "POST",
"data": function (data) {
return JSON.stringify(data);
},
// config for data coming back from the server
"dataType": "json",
"dataSrc": function (json) {
var jsObj = $.parseJSON(json);
return jsObj.data;
}
},
"columns": [
{
"name": "name1",
"data": "key_column1",
"defaultContent": "(no data)"
},
{
"name": "name2",
"data": "key_column2",
"defaultContent": "(no data)"
},
{
"name": "name3",
"data": "key_column3",
"defaultContent": "(no data)"
},
{
"name": "name4",
"data": "key_column 4",
"defaultContent": "(no data)"
},
{
"name": "name5",
"data": "key_column5",
"defaultContent": "(no data)"
},
{
"name": "name6",
"data": "key_column6",
"defaultContent": "(no data)"
}
],
"dom": '<f><lip><rt><ip>',
"language": {
"search": "Search:"
},
"pagingType": "full_numbers"
});
yadcf.init(myTable, [{
column_number: 0,
filter_type: "text"
}, {
column_number: 1,
filter_type: "text"
}, {
column_number: 2,
filter_type: "text"
}, {
column_number: 3,
filter_type: "date"
}, {
column_number: 4,
filter_type: "text"
}, {
column_number: 5,
filter_type: "text"
}]);
}
}
Насколько я могу сказать, что я звоню функцию инициализации правильно на мой DataTable, но абсолютно ничего не происходит, когда я включаю вызов init(). Я не получаю никаких ошибок, и ошибок в консоли FireBug нет.
Я прочитал другие сообщения, где люди действительно получили сообщение об ошибке, возможно, потому, что они использовали старую версию DataTables с новой функцией init() или наоборот, но это не относится ко мне.
Я даже отлаживал исходный файл для YADCF, и я могу видеть вызывающий код, который создает элементы, которые будут добавлены в заголовок таблицы, но по какой-то причине я никогда ничего не вижу в самой таблице.
Конфигурация на стороне сервера должна быть неактуальной в этом случае, поскольку она предоставляет только данные для таблицы и не имеет ничего общего с визуальной конфигурацией таблицы. Поэтому я не думаю, что проблема есть.
Пожалуйста, помогите.
вы можете предоставить ссылку на свой тестовый пример? – Daniel
Ну, я попытался создать его на [link] (http://live.datatables.net/), но я не могу найти способ импорта файлов JS и CSS YADCF. Насколько я знаю, нет ссылки на CDN, содержащий их, поэтому я не могу называть функцию yacdf init() без получения ошибки. – whomovedmycheese15
вы можете использовать https://rawgit.com/ для мгновенного cdn, здесь немного изменен jsbin вашего образца http://live.datatables.net/papuvuqi/1/edit (yadcf работает отлично) – Daniel