我在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的第一个网格记录....
...问题 1.我的问题是因为表id的多个实例=&#34; tblsubWebGrid&#34;? 2.我的jquery脚本是否需要更改,以便它适用于这些子webgrids的所有实例?
答案 0 :(得分:0)
更新:稍微更改了我的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>