Question

我正在尝试规范webgrid子表中行的大小，但没有成功。以下是我的表创建脚本的开头：

@grid.GetHtml(
            htmlAttributes: new { id = "gridT", width = "700px" },
            tableStyle: "webgrid-table",
            columns: grid.Columns(
                    grid.Column("singleUser.RA_Responsible_Person", "RA Responsible Person"),
                    grid.Column("singleUser.Issues_Count", "Issues Count"),
                    grid.Column(header: "Min Deadline", format: (item) => string.Format("{0:dd-MM-yyyy}", item.singleUser.Min_Deadline)),
                    grid.Column(header: "Max Deadline", format: (item) => string.Format("{0:dd-MM-yyyy}", item.singleUser.Max_Deadline)),

                    grid.Column(format: (item) =>
                    {
                        WebGrid subGrid = new WebGrid(source: item.Cases, canPage: true, rowsPerPage: 5);
                        return subGrid.GetHtml(
                            htmlAttributes: new { id = "subT" },
                            columns: subGrid.Columns(
                                    subGrid.Column("Issue_ID", "Issue_ID"),
                                    subGrid.Column("Issue", "Issue"),
                                    subGrid.Column("Case_Status", "Case_Status"),
                                    subGrid.Column("Issued_by", "Issued_by"),
                                    subGrid.Column("Issue_Date", "Issue_Date"),
                                    subGrid.Column("Issue_Type", "Issue_Type"),
                                    subGrid.Column("Server_Name", "Server_Name"),
                                    subGrid.Column("DB_Name", "DB_Name"),
                                    subGrid.Column("Issue_Desciption", "Issue_Desciption", style: "longTextColumn"),
                                    subGrid.Column("RA_Responsible_Person", "RA_Responsible_Person"),
                                    subGrid.Column("Reasons_For_Issue", "Reasons_For_Issue", style: "longTextColumn"),...

我将一些列分配到“longTextColumn”类中，该类应该更宽：

.longTextColumn {
    max-height: 60px;
    width: 350px;
    overflow: hidden;
}

然后，我将max-height指定给主表中的每一行，因为我需要将信息放在较小的空间中。

    #gridT tr:nth-child(odd) {
        background: #eee;
        max-height: 20px;
        overflow: hidden;
    }

    #gridT tr:nth-child(even) {
        background: #fff;
        max-height: 20px;
        overflow: hidden;
    }

当然，这些东西不起作用，因为大小定义不再适用于单个列。我曾经通过在单元格中嵌入div来解决问题，但是使用这段代码idk我怎么也不想这样做。任何人都可以给我一个建议吗？

提前致谢！

PS：我试图为我的整个表分配固定宽度 - 它没有帮助。我知道我分配了冲突的最大高度，但没有一个影响行，所以没关系。另外，我在另一个之前做了其中一种风格，但它没有用。

Answer 1

毕竟，我已经使用了我原来经过测试的解决方案 - 我通过在td单元周围包裹div来进行攻击。非常无效和不必要。我希望有一天，好人们会再次打赌我们的情报，并允许我们在自己的专栏上设置大小。

以下是解决方案：

添加了一个类：

                        columns: subGrid.Columns(
                                    subGrid.Column("Issue_ID", "Issue_ID"),
                                    subGrid.Column("Issue", "Issue", style: "long"), .....

和一个脚本：

    <script>
        $(".long").each(function () {
            $(this).wrapInner("<div class='longTextColumn'></div>");
        });
    </script>

无法为webgrid列和行设置宽度或高度

1 个答案: