如何仅限制网格中的jqgrid textarea高度

Question

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

Oleg回答来自How to restrict maximum height of row in jqgrid

将视图窗口中的textarea高度限制为单行。 如何仅在网格中显示第一行，但在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日志查看器中：移动到事件行在单独的窗口中显示事件长数据

Answer 1

如果我能正确理解您的问题，您可以通过相对简单的方式解决问题。您应该使用CSS而不是内联样式来设置具有多行数据的div的max-height。例如，您可以使用<td>属性colModel在具有多行元素的列的classes: "textInDiv"元素上设置一些类。例如，您将使用<td>相应列中单元格的{name: "Description", edittype: "textarea", classes: "textInDiv", formatter: function (v) { return '<div>' + $.jgrid.htmlEncode(v) + '</div>'; }} 将获取class属性。因为您在网格内部和视图表单内部具有不同的元素层次结构，所以您可以在两种情况下指定不同的高度限制：

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

和

max-height

classes展示了结果。如何在以下图片中看到单元格的{{1}}对于网格和视图形式是不同的：