Jquery Datatables Ajax方法單元格對齊

我正在使用數據表顯示數據庫表值。我正在使用ajax方法執行此操作。下面是代碼Jquery Datatables Ajax方法單元格對齊

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

      });

的filename.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>"]] }

現在我得到了正確的顯示，但按年齡排序時它是不正確的。請幫忙。謝謝

來源

2012-01-02 Vasanthan.R.P

我認爲你應該做這樣的事情（使用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; 
}

這樣的DataTable手柄附加類的元素和排序工作正確。當然使用第一個JSON

來源

2012-01-02 13:42:24

太好了，我會嘗試這一個，讓你知道。謝謝 – 2012-01-02 13:46:11

@ Vasanthan.RP我也發佈了一個鏈接，你可以找到文檔aoColumns – 2012-01-02 13:48:39

偉大的作品。 – 2012-01-03 12:04:29

您不能將DIV元素附加到TABLE正文！您必須創建新的TR元素，將所有的DIV更改爲TD，然後將它們附加到TR元素ant，然後將TR元素附加到TABLE主體。

UPDATE DIV元素沒有屬性對齊，你必須使用CSS來做到這一點。

來源

2012-01-02 13:40:34 Irmantas

按照數據表，這些元素將自動置於tds內，我希望。所以我需要一種方法來對齊它們。謝謝 – 2012-01-02 13:42:41

他可以做到這一點，但如果他這樣做，排序將無法正常工作（除非他刪除html。我認爲你可以使用類來通過數據表來做他想做的事）API – 2012-01-02 13:44:59

我更新了我的答案 – Irmantas 2012-01-02 13:55:36

現在我得到了正確的顯示，但按年齡排序它是不正確的。請幫忙。謝謝

由於您在該列中有HMTL，DataTables會自動將其檢測爲類型'字符串'並對其進行相應的排序。如果您希望它按照數字排序，剝離HTML數據，請使用此插件：http://datatables.net/plug-ins/sorting#numbers_html

來源

2012-01-02 22:40:22

Jquery Datatables Ajax方法單元格對齊

回答

相關問題