jqgrid长文本换行

Question

JqGrid中我们从数据库获取了长文本，但需要在显示在JqGrid时进行换行，是否有任何方法可以换行长文本（没有任何空格）？因为我们有多个列需要显示，所以只有110px的宽度用于收款人名称字段。我们的代码如下：

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

如果有解决方案，请提供，谢谢。

- Sabarish

---

你应该为行设置white-space: normal !important;样式。请查看答案。如果你需要在列标题中换行，请看这里。 - Oleg

这只适用于单词之间有一些空格的情况。但是我没有任何空格，而且这个单词很长。 - Sabarish

Answer 1

如果你需要显示的测试数据没有空格或其他空白字符，你不能使用在这里和这里描述的CSS样式。

我建议你使用另一种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”将显示如下：

- Oleg

---

在视图模型对话框中有没有办法进行自动换行？因为我的字段中有很长的文本。如果我点击查看，它会显示带滚动条的弹出窗口。我不想要那个。我想在那里进行自动换行... - CJ Ramki

@CJRamki：有很多选择。答案向您展示了您可以使用的主要CSS规则。您可以像这里一样将其与max-height规则相结合。 - Oleg

Answer 2

.ui-jqgrid tr.jqgrow td
{           
    word-wrap: break-word; /* IE 5.5+ and CSS3 */
    white-space: pre-wrap; /* CSS3 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    white-space: normal !important;
    height: auto;
    vertical-align: text-top;
    padding-top: 2px;
    padding-bottom: 3px;
}

使用上述代码是有效的。即使你不添加空格，它也会换行。

- user2400795

Answer 3

上述解决方案对我没有起作用，但稍加修改就可以了！ 进入themes/ui.jqgrid.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

- Paschalis

---

这是因为您在HTML中的样式表的顺序吗？如果您定义的自定义样式在链接到 ui.jqgrid.css 之前，那么您的样式可能不会生效。 - Scotty.NET

我现在记不太清了。我为jqrid定义了自己的样式！也许顺序影响了这个！谢谢Scotty！ - Paschalis