jqgrid长文本换行 [英] jqgrid long text wrapping

问题描述

在jqgrid中，我们有从数据库中获取的长文本，但是在JQgrid中显示时需要换行，是否有任何方法可以换行长文本(没有空格)?我们只有110像素可用于收款人姓名字段，因为我们需要显示多列.我们的代码就像

{name:"firstPayeeName",index:"firstPayeeName", width:"110px", align:"left", sorttype:"string"},

请提供解决方案(如果有).预先感谢.

解决方案

如果需要显示的测试没有没有空格或其他空白，则不能使用CSS样式在此处中进行了描述和此处. /p>

我建议您使用其他CSS样式:

<style type="text/css">
    .ui-jqgrid tr.jqgrow td {
        word-wrap: break-word; /* IE 5.5+ and CSS3 */
        white-space: pre-wrap; /* CSS3 */
        white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
        white-space: -pre-wrap; /* Opera 4-6 */
        white-space: -o-pre-wrap; /* Opera 7 */
        overflow: hidden;
        height: auto;
        vertical-align: middle;
        padding-top: 3px;
        padding-bottom: 3px
    }
</style>

如何从演示中看到文本"testtesttesttesttesttesttesttesttest"将显示如下:

In jqgrid we have long text getting from DB, but need to wrap while displaying in JQgrid, is there any way to wrap long text (with out any spaces)? We have only 110px to spare for payee name field because we have multiple columns needs to be displayed. Our code is like

{name:"firstPayeeName",index:"firstPayeeName", width:"110px", align:"left", sorttype:"string"},

Pls provide solution if any. Thanks in advance.

解决方案

In case of the test which you need to display has no blanks or other white-space you can't use the CSS style described here and here.

I would recommend you to use another CSS style:

<style type="text/css">
    .ui-jqgrid tr.jqgrow td {
        word-wrap: break-word; /* IE 5.5+ and CSS3 */
        white-space: pre-wrap; /* CSS3 */
        white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
        white-space: -pre-wrap; /* Opera 4-6 */
        white-space: -o-pre-wrap; /* Opera 7 */
        overflow: hidden;
        height: auto;
        vertical-align: middle;
        padding-top: 3px;
        padding-bottom: 3px
    }
</style>

How you can see from the demo the text "testtesttesttesttesttesttesttesttest" will be displayed as the following:

这篇关于jqgrid长文本换行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！