2

Textarea 包含很多或行。在 jqgrid 网格中，只应显示第一行。在 jqgrid 视图窗口中，还应显示更多行和可能的滚动条。

如何限制 jqgrid 中行的最大高度的Oleg 答案

将视图窗口中的文本区域高度也限制为单行。如何仅在网格中显示第一行但在 jqgrid 视图形式中显示更多行？

colmodel 是：

{"name":"Description",
  "edittype":"textarea",
  "wrap":"on",
  "formatter":function(v){ return '<div style="max-height:20px">'+$.jgrid.htmlEncode(v)+'</div>';
                             } 
  ,"editoptions":{"class":"","rows":18,"wrap":"off","style":"width:800px",
      "readonly":"readonly"
      },
  "editrules":{"edithidden":true},"editable":true,"width":539,
  "classes":"jqgrid-readonlycolumn"}

jqgrid 视图窗口显示多行。这应该保持不变：

具有多行的正确视图窗口

网格还显示多条线。这是错误的。：

文本区域中具有多行的网格

如何强制网格在每个文本区域中仅显示第一行

或者可以在屏幕底部显示更多行：如果某行变为活动状态，则 textarea 列的前 10 行应显示在底部。这就像在 Windows 日志查看器中：移动到事件行在单独的窗口中显示事件长数据

4

1 回答 1

2

如果我正确理解您的问题，您可以以相对简单的方式解决它。您应该只使用 CSS 而不是内联样式来设置max-height具有多行数据的 div。例如，您可以使用的classes属性在<td>具有多行元素的列元素上设置一些类。例如是你会使用对应列中的单元格的来获取类属性。因为您在网格内部和视图表单内部具有不同的元素层次结构，您可以在两种情况下指定不同的高度限制：colModelclasses: "textInDiv"<td>

{name: "Description", edittype: "textarea", classes: "textInDiv",
    formatter: function (v) {
        return '<div>' + $.jgrid.htmlEncode(v) + '</div>';
    }}

和

tr.jqgrow>td.textInDiv>div {
    max-height: 20px;
    overflow: auto
}
td.form-view-data>span>div {
    max-height: 150px;
    overflow: auto
}

演示演示了结果。您如何在以下图片中看到max-height单元格包含的网格和视图表单不同：

在此处输入图像描述

在此处输入图像描述

于 2012-11-11T11:47:33.840 回答