jquery datatables word wrap不工作

时间:2016-06-21 08:18:03

标签: php jquery mysql css datatables-1.10

如果值太长,我的数据表的列看起来会更宽。

enter image description here

我关注thisthis。 并设置宽度:

aTable = $("#printdata").dataTable({
     "bAutoWidth" : false,
     "bRetrieve"  : true,
     "scrollY": 200,
     "scrollX": true,
     "deferRender": true,
     "scroller": {
          loadingIndicator: true
          },
     "bServerSide": true,
     "bProcessing": true,
     "sAjaxSource": 'show2ndsampling.php',
     "fnServerData": function (sSource,aoData,fnCallback){
          $.ajax({
                   "dataType":'json',
                   "type":'POST',
                   "url":sSource,
                   "data":aoData,
                   "success":function(json){
                          fnCallback(json);
                          }
                   });
          },
    "order"  : [[1,"desc"]],
    "aoColumns"  : [
    /*serial*/{ "width": "30%", target : 3 }
    ]

但我的数据表没有变化。

3 个答案:

答案 0 :(得分:3)

我会这样做

table.dataTable tbody td {
  word-break: break-word;
  vertical-align: top;
}

演示 - >的 http://jsfiddle.net/qh63k1sg/

这意味着autoWidth设置为false,并且您已经为列提供了固定的宽度(如演示文稿和OP所描述的那样,aoColumns / columns

答案 1 :(得分:1)

现在,我可以告诉你,显示数据的最佳方式是修改输出。

这意味着:

  1. 如果您在sql query - >基础上创建回复你应该优化 它并在你的问题中添加一个空格。
  2. 如果你在模板中执行 - >准备关于模板部分的数据,例如PHP
  3. 如果你在前端部分进行,请以JS方式进行。
  4. PHP方式:

    $result = array( /* your result */);
    foreach($result as &$answer ){
       $answer = implode( ", ", explode( ",", $answer) );
    }
    

    JS方式:

    var result = [/* your result */];
    for( var index = 0; index < result.length; i++ ){
      result[index] = result[index].split(",").join(", ");
    }
    

答案 2 :(得分:0)

您可以使用css解决此问题。

table /* give class of table*/
{
   table-layout: fixed;
}

table td
{
  word-wrap:break-word;   
  overflow: hidden;
}