webgrid 相关问题

WebGrid是ASP.NET Web页面框架内置的视图控件。它在给定集合的情况下显示可排序的可分页HTML网格，并且可以通过各种方式进行自定义，并使用.NET 4.0的“动态”对象类型。

我正在使用WebGrid，我需要使用Ajax 在页面之间切换。索引代码 <p>我正在使用 <pre><code>WebGrid</code></pre>，我需要使用 Ajax 在页面之间切换。</p> <p><strong>索引代码</strong></p> <pre><code><script src="../../Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script> <script src="../../Scripts/jquery-1.5.1.min.js" type="text/javascript"></script> @using (Ajax.BeginForm("GetGrid", new AjaxOptions() { UpdateTargetId = "Res" })) { <input type="text" /> <input type="submit" value="start" /> <div id="Res"> </div> } </code></pre> <p><strong>结果部分视图</strong></p> <pre><code>@model IEnumerable<MvcApplication1.Controllers.Model> <div id="grid2"> @{ var grid = new WebGrid(source:Model,rowsPerPage:6,ajaxUpdateContainerId: "grid2"); @grid.GetHtml(htmlAttributes: new { id = "grid2" }, columns: grid.Columns( grid.Column("Someting") )); } </div> </code></pre> <p><strong>控制器代码</strong></p> <pre><code> public class ABCController : Controller { // // GET: /ABC/ public ActionResult Index() { return View(); } public static List<Model> mo = new List<Model>(); [HttpPost] public ActionResult GetGrid() { for (int i = 0; i < 1000; i++) { mo.Add(new Model() { Someting = i.ToString() }); } return PartialView("Result", mo); } } public class Model { public string Someting { get; set; } } </code></pre> <p>这适用于首页，但其他页面没有任何反应。</p> </question> <answer tick="true" vote="1"> <p>几个小时后，我找不到一些对我有帮助的东西。我注意到我的页面链接的 html 代码。页面链接 </p> <pre><code><a href="#" onclick="$('#grid2').load('/ABC/GetGrid?page=2&amp;__=635163360142144025 #grid2');">2</a> </code></pre> <p>所以我终于明白了它是如何工作的。我向我的控制器添加了一个<pre><code>ActioResult</code></pre>，如下所示：</p> <pre><code> [HttpGet] public ActionResult GetGrid(int page) { return PartialView("Result",mo); } </code></pre> <p>并且有效。我希望这对某些人有帮助</p> </answer> </body></html>

ajax asp.net-mvc-3 pagination webgrid

回答 0 投票 0

在mvc3 webgrid中实现行号和分页？

我想为网络网格自动生成行号，我可以使用下面的代码来做到这一点 grid.Column(标题：“行号”，格式：item => item.WebGrid.Rows.IndexOf(item) + 1), 问题...

asp.net-mvc-3 pagination webgrid

回答 2 投票 0

我想在MVC webgrid点击排序分页时调用loader图片？

我创建了一个div并尝试像loader.show()那样调用Jquery。但不确定当我对 mvc webgrid 进行分页或排序时如何触发它？我的网络网格： @{ var grid = 新的 WebGrid< 我创建了一个 div 并尝试像 loader.show() 一样调用 Jquery。但不确定当我对 mvc webgrid 进行分页或排序时如何触发它？我的网络网格： <div id="grid"> @{ var grid = new WebGrid<MemberSearch>(ajaxUpdateContainerId: "grid", rowsPerPage: Model.PageSize, defaultSort: "LastName"); grid.Bind(Model.Member, rowCount: Model.TotalRows, autoSortAndPage: false); // NOTE: I've created another html helper to allow a server-paged grid to be rendered in one call (complete with compiler type inference) as shown below //var grid = Html.ServerPagedGrid(Model.Products, Model.TotalRows, rowsPerPage: Model.PageSize); } @grid.GetHtml(tableStyle: "webgrid", headerStyle: "webgrid-header", footerStyle: "w-footer", alternatingRowStyle: "webgrid-alternating-rows", columns: grid.Columns( grid.Column(format: @<text>@Html.ActionLink("Edit", "Edit", new { Id = item.Id }) </text>), grid.Column("fullname", header: "Name", format: @<text>@item.fullname</text>), grid.Column("Email", header: "Email", format: @<text>@item.Email</text>), grid.Column("companyname", header: "Company", format: @<text>@item.companyname</text>), grid.Column("regDate", header: "Registration Date", format: @<text>@item.regDate</text>), grid.Column("country", header: "Country", format: @<text>@item.country</text>), grid.Column("modifiedDate", header: "Profile Modified", format: @<text>@item.modifiedDate</text>), grid.Column("ciscontactid", header: "CIS ID", format: @<text>@item.ciscontactid</text>) ) ) </div> 在您的文档中，准备好添加以下内容： $('thead > tr > th > a[href$="sort"]').click(function () { loader.show() }); 这将选择 WebGrid getHtml 为您生成的 th 标签和 a 标签。这将在网格排序时进行处理。

image model-view-controller pagination webgrid

回答 1 投票 0

Razor 嵌套 WebGrid

我如何嵌套 WebGrid，并为每列设置大量格式。我可以做一个嵌套的 for 循环，但我基本上需要它来进行分页。或者还有其他更好的选择吗？

asp.net-mvc asp.net-mvc-3 razor pagination webgrid

回答 1 投票 0

有人有 mvc3 webgrid json 分页的工作示例吗？

有人有 mvc3 webgrid json 分页的工作示例吗？我已经在互联网上搜索了几个小时了，现在正在寻找这个，我能找到的最好的就是这个链接：Efficient Paging with WebGr...

json ajax asp.net-mvc-3 pagination webgrid

回答 1 投票 0

webgrid 中的分页在 asp.net mvc 5 中不起作用

我有以下视图和控制器。问题是，当启用分页并单击下一页时，上一个视图消失了 @使用系统 @使用System.Web.Helpers @*@型号列表我有以下视图和控制器。问题是，当启用分页并单击下一页时，上一个视图消失了 @using System @using System.Web.Helpers @*@model List<DataTransferObjects.UserClaimHistory>*@ <!DOCTYPE html> <html lang="en"> <head runat="server"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="~/Content/style.css" rel="stylesheet" type="text/css" /> @*<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>*@ <script src="~/Scripts/jquery-1.7.1.js"></script> <style> /*Here I will write some css for looks good*/ th, td { padding: 5px; } th { background-color: gray; } </style> </head> @{ ViewBag.Title = "ViewReports"; var grid = new WebGrid(Model, canPage: false, rowsPerPage: 2, selectionFieldName: "selectedRow", ajaxUpdateContainerId: "gridContent", canSort: false); } @{ var fromDateVal = (DateTime)ViewBag.fromDate; var toDateVal = (DateTime)ViewBag.toDate; } @using (Html.BeginForm("Index", "ViewReport", FormMethod.Post)) { <div class="container"> @{ var homeHeader = Html.Partial("_HomeHeader"); } @homeHeader <div id="logout-div"> @Html.ActionLink("Log Out", "Logout", "Home", null, null ) </div> @{ var homeLeftPanel = Html.Partial("_HomeLeftPanel"); } @homeLeftPanel <div> From Date: @Html.TextBox("fromDate", string.Format("{0:yyyy-MM-dd}", fromDateVal), new { @id = "fromDate", @class = "datefield", type = "date" }) To Date: @Html.TextBox("toDate", string.Format("{0:yyyy-MM-dd}", toDateVal), new { @id = "toDate", @class = "datefield", type = "date" }) <input type="submit" value="Search" /> </div> <div id="main" style="padding: 25px;"> @grid.GetHtml( htmlAttributes: new { id = "MainGrid", width = "60%" }, tableStyle: "table table-bordered table-responsive", headerStyle: "header", alternatingRowStyle: "alt", selectedRowStyle: "select", columns: grid.Columns( grid.Column("UserName", "User Name"), grid.Column("Email", "Email"), grid.Column("Claim", "Accessed"), grid.Column(header: "AccessedOn", format: (item) => string.Format("{0:dd-MM-yyyy}", item.AccessedOn)), grid.Column(format: (item) => { if (item.Count > 1) { var subGrid = new WebGrid(source: item.List, canSort: false); return subGrid.GetHtml(displayHeader: true, htmlAttributes: new { id = "SubGrid", width = "100%" }, columns: subGrid.Columns( subGrid.Column("UserName", "User Name"), subGrid.Column("Email", "Email"), subGrid.Column("Claim", "Accessed"), subGrid.Column("AccessedOn", "AccessedOn") ) ); } else { return null; } }) ) ) <script> $(document).ready(function () { var size = $("#main #MainGrid > thead > tr > th").size(); // get total column $("#main #MainGrid > thead > tr > th").last().remove(); // remove last column $("#main #MainGrid > thead > tr").prepend("<th></th>"); // add one column at first for collapsible column $("#main #MainGrid > tbody > tr").each(function (i, el) { $(this).prepend( $("<td></td>") .addClass("expand") .addClass("hoverEff") .attr('title', "click for show/hide") ); //Now get sub table from last column and add this to the next new added row var table = $("table", this).parent().html(); // // alert(table); //add new row with this subtable // ADD CLICK EVENT FOR MAKE COLLAPSIBLE if (table !== null) { $(this).after("<tr><td></td><td style='padding:5px; margin:0px;' colspan='" + (size - 1) + "'>" + table + "</td></tr>"); $("table", this).parent().remove(); $(".hoverEff", this).live("click", function () { $(this).parent().closest("tr").next().slideToggle(100); $(this).toggleClass("expand collapse"); }); } else { $(this).find('td:eq(0)').removeClass(); } }); //by default make all subgrid in collapse mode $("#main #MainGrid > tbody > tr td.expand").each(function (i, el) { $(this).toggleClass("expand collapse"); $(this).parent().closest("tr").next().slideToggle(100); }); }); </script> </div> @if (ViewBag.Count > 0) { <div> @Html.ActionLink("Export", "ExportToExcel", "ViewReport", new { fromDate = fromDateVal, toDate = toDateVal}, null) </div> } @{ var homeFooter = Html.Partial("_HomeFooter"); } @homeFooter </div> } </html> 这是控制器： public ActionResult Index(DateTime? fromDate, DateTime? toDate) { if (!fromDate.HasValue) fromDate = DateTime.Now.Date; if (!toDate.HasValue) toDate = fromDate.GetValueOrDefault(DateTime.Now.Date).Date.AddDays(1); if (toDate < fromDate) toDate = fromDate.GetValueOrDefault(DateTime.Now.Date).Date.AddDays(1); ViewBag.fromDate = fromDate; ViewBag.toDate = toDate; var userClaims = DbAccessWebApiHandler.GetUserClaimAccesshistory(new DateSelection { StartDate = fromDate.Value, EndDate = toDate.Value }); if (userClaims != null) { ViewBag.Count = userClaims.Count; var newList = userClaims.GroupBy(x => new { x.UserName, x.Email, x.Claim, x.AccessedOn.Date }) .Select(y => new UserClaimHistoryGroup { UserName = y.Key.UserName, Email = y.Key.Email, Claim = y.Key.Claim, AccessedOn = y.Key.Date, List = y.ToList(), Count = y.ToList().Count }); return View(newList); } userClaims = new List<UserClaimHistory>(); return View(userClaims); } [System.Web.Mvc.HttpGet] public ActionResult ExportToExcel(DateTime? fromDate, DateTime? toDate) { if (!fromDate.HasValue) fromDate = DateTime.Now.Date; if (!toDate.HasValue) toDate = fromDate.GetValueOrDefault(DateTime.Now.Date).Date.AddDays(1); if (toDate < fromDate) toDate = fromDate.GetValueOrDefault(DateTime.Now.Date).Date.AddDays(1); ViewBag.fromDate = fromDate; ViewBag.toDate = toDate; var userClaims = DbAccessWebApiHandler.GetUserClaimAccesshistory(new DateSelection { StartDate = fromDate.Value, EndDate = toDate.Value }); if (userClaims != null) { var gv = new GridView(); gv.AutoGenerateColumns = false; gv.Columns.Add(new BoundField { HeaderText = "UserName", DataField = "UserName" }); gv.Columns.Add(new BoundField { HeaderText = "Email", DataField = "Email" }); gv.Columns.Add(new BoundField { HeaderText = "Accessed", DataField = "Claim" }); gv.Columns.Add(new BoundField { HeaderText = "Date", DataField = "AccessedOn" }); var dt = new DataTable(); dt.Columns.Add("UserName"); dt.Columns.Add("Email"); dt.Columns.Add("Claim"); dt.Columns.Add("AccessedOn"); foreach (var item in userClaims) { dt.Rows.Add(item.UserName, item.Email, item.Claim, item.AccessedOn); } gv.DataSource = dt; gv.DataBind(); for (var i = 0; i < userClaims.Count; i++) { gv.Rows[i].Height = 40; } Response.ClearContent(); Response.Buffer = true; Response.AddHeader("content-disposition", "attachment; filename=Reports.xls"); Response.ContentType = "application/ms-excel"; Response.Charset = ""; var sw = new StringWriter(); var htw = new HtmlTextWriter(sw); gv.RenderControl(htw); Response.Output.Write(sw.ToString()); Response.Flush(); Response.End(); } return View("Index"); } 能够通过以下脚本工作 var links = $('a[href*=page], a[href*=sort]'), form = $('form'); links.click(function () { form.attr("action", this.href); $(this).attr("href","javascript:"); form.submit(); }); 如在 MVC4 站点中进行排序或分页操作期间如何让 WebGrid 以 POST 而不是 GET 方式进行操作？

c# asp.net-mvc razor pagination webgrid

回答 1 投票 0

MVC3 中的 WebGrid 分页问题

问题是分页工作正常，直到第9页码，当我请求两位数或更多位数字的页面时，它会获取最后一位数字并忽略其余数字，例如如果我

c# asp.net asp.net-mvc-3 pagination webgrid

回答 2 投票 0

通过ajax更新时如何在ASP.NET MVC WebGrid中保持排序和分页？

使用 ASP.NET WebGrid 时，分页和排序通过将特定查询字符串附加到 url 来实现，其中包含说明页码、排序方向等的名称和值。然而，当使用

asp.net sorting pagination webgrid

回答 2 投票 0

Webgrid 替代布局？

好的，这是我的第一个问题，我认为这是一个很好的问题。我想在 MVC 4 C# 中布局一个与标准表格不同格式的网络网格。我正在寻找的是这样的布局

asp.net-mvc sorting asp.net-mvc-4 pagination webgrid

回答 1 投票 0

MVC3 razor Webgrid 分页和排序超过 2000 条记录

我正在使用类似于这里提到的网络网格 @{ var grid = new WebGrid(canPage: true, rowsPerPage: ThisController.PageSize, canSort: true, ajaxUpdateContainerId: "grid"); 网格.绑定(

sorting asp.net-mvc-3 razor pagination webgrid

回答 4 投票 0

Ajax 调用后 MVC Webgrid 分页和排序停止工作

我创建了一个 MVC 应用程序，它使用 webgrids 在我的视图上显示数据。在我的网格工具栏中，我有下拉菜单、文本框和一个搜索按钮，它们调用 Jquery 来执行各种操作...

ajax asp.net-mvc sorting pagination webgrid

回答 1 投票 0

MVC Webgrid，排序和分页后 JavaScript 停止工作

我的网络网格有问题，在我的一个专栏中，我有一个带有带有单击功能的 JavaScript 的操作链接，一切正常。但是在我对任何列进行排序或分页后...

javascript asp.net-mvc sorting pagination webgrid

回答 2 投票 0

MVC3 WebGrid：排序或分页时，有没有办法在调用 Controller Action 方法之前调用 javascript 方法？

我一直使用此链接作为开发 WebGrid 的参考 (http://msdn.microsoft.com/en-us/magazine/hh288075.aspx)。目前发生的情况是我的 WebGrid 已加载，并且我能够