Question

我在webgrid中有一个子Webgrid，每个记录返回用户...

<div id="grid">
        @grid.GetHtml(
            tableStyle: "webgrid",
            headerStyle: "webgrid-header",
            footerStyle: "webgrid-footer",
            alternatingRowStyle: "webgrid-alternating-row",
            selectedRowStyle: "webgrid-selected-row",
            columns: grid.Columns( grid.Column("BlogBlogId", "BlogId ",style: "BlogBlogId"),
                                    grid.Column("Domain", "Domain",style: "Domain"),
                                    grid.Column("Path", "Path",style: "Path"),
                                    grid.Column("BlogUsers", "Blog Users", style: "BlogUsers", format : (item) =>
                                    {
                                        string temp = "<div style='text-align:left;height:100%;" + "width: 100%; overflow: auto; overflow-x:hidden;'>";
                                        var sub = new WebGrid(item.BlogUsers,
                                           canPage: false,
                                           ajaxUpdateContainerId: "sub",
                                           ajaxUpdateCallback: "jQueryTableStyling",
                                           defaultSort: "BlogBlogId", 
                                           rowsPerPage: 100);
                                           temp += sub.GetHtml(htmlAttributes: new { id = "tblsubWebGrid" },
                                           columns:sub.Columns(
                                                    sub.Column("UserLogon", "Logon"),
                                                    sub.Column("Adstatus", "AdStatus")
                                                   )
                                            );
                                        temp += "</div>";
                                        return new HtmlString(temp);

                                    }),
                                    grid.Column("Archived", "Archived",style: "Archived"),
                                    grid.Column("Deleted", "Deleted",style: "Deleted"),
                                    grid.Column("Allusersvalid", "All Users Valid?",style: "User IP")


                )
             )
    </div>

我根据用户的状态应用文本颜色更改...

<script>
    function styleGrid() {
        $("#tblsubWebGrid tr:not(:first)").each(function () {
            var aptStatus = $(this).find("td:nth-child(2)").html();
            if (aptStatus == 'User Exists') {
                $(this).find("td:nth-child(2)").addClass("clsGreen");
            } else {
                $(this).find("td:nth-child(2)").addClass("clsRed");
            }

        });
    }

    $(document).ready(function() {
        styleGrid();
    });
</script>

问题：这些类仅应用于带有子webgrid的第一个网格记录....

enter image description here

...问题 1.我的问题是因为表id的多个实例=＆＃34; tblsubWebGrid＆＃34;？ 2.我的jquery脚本是否需要更改，以便它适用于这些子webgrids的所有实例？

Answer 1

更新：稍微更改了我的Jquery，删除了＆＃34;：not（：first）＆＃34;来自＆＃34; tblsubWebGrid tr＆＃34;它开始为我添加CSS类引用..

<script>
    function styleGrid() {
        $("#tblsubWebGrid tr").each(function () {
            var aptStatus = $(this).find("td:nth-child(2)").html();
            if (aptStatus == 'User Exists') {
                $(this).find("td:nth-child(2)").addClass("clsGreen");
            } else {
                $(this).find("td:nth-child(2)").addClass("clsRed");
            }

        });
    }

    $(document).ready(function() {
        styleGrid();
    });
</script>

如何处理嵌入式webgrid样式

1 个答案: