easyui-datagrid列的数据内容过长自动换行

Posted Mr_伍先生

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyui-datagrid列的数据内容过长自动换行相关的知识,希望对你有一定的参考价值。

 在datagrid中添加一句,DataGrid属性中的nowrap:false。

(默认为true)。

 

 

JS文件:

$(\'#_main_table\').datagrid({
                        method:\'get\',
                         url: \'xxxxx\',
                         checkbox:true,
                         pagination: true,
                         fit: true,
                         cache:false, 
                         fitColumns: true,
                         border: false,
                         rownumbers: true,
                         nowrap:false,                     
                         frozenColumns:[[
                                        {field:\'id\',checkbox:true,hidden:true}
                                    ]],        
                         loadFilter: function(data) { return data.data;
                         },
                        });

 

 

效果图:

 

 

 

 参见,  html <td> 标签的 nowrap 属性

 

<html>
<body>

<table border="1">
  <tr>
    <th>Poem</th>
    <th>Poem</th>
  </tr>
  <tr>
    <td nowrap="nowrap">Never increase, beyond what is necessary, the number of entities required to explain anything</td>
    <td>Never increase, beyond what is necessary, the number of entities required to explain anything</td>
  </tr>
</table>

<p>在 HTML 4.01 中,不赞成使用 td 元素的 nowrap 属性;在 XHTML 1.0 Strict DTD 中,不支持 td 元素的 nowrap 属性。</p>

</body>
</html>

 

 

 

 

转载于:http://www.w3school.com.cn/tags/att_td_nowrap.asp

 

以上是关于easyui-datagrid列的数据内容过长自动换行的主要内容,如果未能解决你的问题,请参考以下文章

el-table组件内容过长时显示tooltip

easyui-datagrid 行内编辑禁止字段可编辑

div内容过长自动省略号

easyui-datagrid 获取所有行列值

jQuery easyUI easyui-datagrid 选中指定内容的行

为啥easyui-datagrid分页控件把所有的都遮住了?