Jquery Datatables выравнивание ячеек метода Ajax

Question

Я отображаю значения таблицы базы данных, используя таблицы данных.Я делаю это с помощью метода AJAX.Вот код

$('#example1').dataTable( {
                "bProcessing": true,
                "sAjaxSource": "filename.php",
                "bJQueryUI": true,
                "sPaginationType": "full_numbers"

            } );

Вывод имени файла .php:

{ "aaData": [["1","<input type='checkbox' name='user'>&nbsp;Test Name","Leader","35"]] } 

HTML-код:

<table cellpadding="0" cellspacing="0" border="0" class="display tablehead" id="example1">
              <thead>
                  <tr class="colhead newbg">
                    <th width="17" align="center">No</th>
                    <th width="194" align="left">User</th>
                    <th width="56" align="left">Role</th>
                    <th width="31" align="right">AGE</th>  
                  </tr>
                  </thead>
                    <tbody>

                    </tbody>
              </table>

В приведенном выше HTML вы можете увидетьпервый столбец выровнен по центру, а следующие два столбца выровнены по левому краю, а последний - по правому краю.Но в выводимых данных все выровнено по центру.Я попытался использовать следующее

{ "aaData": [["<div align='center'>1</div>","<div align='left'><input type='checkbox' name='user'>&nbsp;Test Name</div>","<div align='center'>Leader</div>","<div align='right'>35</div>"]] } 

Теперь я получил правильное отображение, но при сортировке по возрасту это не правильно.Пожалуйста помоги.Спасибо

Answer 1

Я думаю, вы должны сделать что-то вроде (используйте aoColumns ):

$('#example1').dataTable( {
                "bProcessing": true,
                "sAjaxSource": "filename.php",
                "bJQueryUI": true,
                "sPaginationType": "full_numbers",
            "aoColumns": [ 
                        {"sClass": "center"},
                        {"sClass": "left"},
                        {"sClass": "left"},
                        {"sClass": "right"},

            } );

А затем определите правильные классы CSS

.right{
  align: right;
}

.left{
  align: left;
}

.center{
  align: center;
}

Таким образом, datatables обрабатывает добавление классов к элементам, и сортировка работает правильно. Конечно, используйте первый JSON

Answer 2

Теперь я получил правильное отображение, но при сортировке по возрасту это не правильно.Пожалуйста помоги.Спасибо

Поскольку в этом столбце есть HMTL, DataTables автоматически определит его как тип 'string' и соответствующим образом отсортирует.Если вы хотите, чтобы он сортировался численно, извлекая данные HTML, используйте этот плагин: http://datatables.net/plug-ins/sorting#numbers_html

Answer 3

Вы не можете добавлять элементы DIV к телу TABLE! Вы должны создать новый элемент TR, изменить все DIV на TD, а затем добавить их в элемент TR и затем добавить элемент TR в тело TABLE.

ОБНОВЛЕНИЕ Элемент DIV не имеет атрибута align, для этого необходимо использовать CSS.