天冬氨酸MVC3的WebGrid寻呼和过滤阿贾克斯 [英] Asp Mvc3 webgrid Paging and Filtering by ajax
问题描述
我有一个小问题的WebGrid控制Asp.Net MVC3。我要的是用Ajax和的WebGrid进行搜索视图;是这样的:
I Have a little problem with WebGrid control for Asp.Net MVC3. What I want is to perform a search view using ajax and webgrid; something like this:
搜索标准______________________________
Search Criteria ______________________________
主题: _ __ _ _
Subject: _____
任务类型: _ 的____
Task Type: _____
提交搜索
的WebGrid withPaging
WebGrid withPaging
当我按一下按钮搜索它调用由阿贾克斯HTTPost操作和应用搜索条件;然而,当我尝试做分页它进入HTTPGET行动;以这种方式,根据搜索条件的过滤器不执行
When I click the button search it call the HTTPost action by ajax and apply the search criteria; however when I try to do paging it goes to the HTTPGet action; in this way, the filter according to the search criteria doesn't execute.
我把一个局部视图中的网格;还有就是code:
I put the grid inside a partial view; there is the code:
@model IEnumerable<MVC3.Models.Task>
@{
var grid = new WebGrid(null, rowsPerPage: 2, canPage: true, canSort: true, ajaxUpdateContainerId: "myGrid");
grid.Bind(Model, rowCount: 3, autoSortAndPage: true);
grid.Pager(mode: WebGridPagerModes.All);
@grid.GetHtml(
columns: grid.Columns(
grid.Column(format: (item) => Html.ActionLink("Assign Notifications", "AssignNotifications", new { id = item.TaskId })),
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { id = item.TaskId })),
grid.Column(format: (item) => Html.ActionLink("Delete", "Delete", new { id = item.TaskId })),
grid.Column("Subject"),
grid.Column("Comment"),
grid.Column(columnName: "Status", header: "Status", format: (item) => item.TaskStatu.Name),
grid.Column(columnName: "StartDate", header: "Start Date", format: (item) => item.StartDate.ToString("MM/dd/yyy")),
grid.Column(columnName: "Deadline", header: "Dead Line", format: (item) => item.Deadline.ToString("MM/dd/yyy"))
)
);
}
和我的索引视图是这样的:
And my Index view looks like:
@model MVC3.ViewModel.TaskSearchViewModel
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>
Task Index</h2>
<hr />
@using (Ajax.BeginForm(new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "myGrid" }))
{
<div id="Filters">
<fieldset>
<legend>Search criteria</legend>
<br />
<table>
<tr>
<td>
@Html.LabelFor(x => x.Subject)
</td>
<td>
@Html.TextBoxFor(x => x.Subject, new { style = "width: 255px;" })
</td>
</tr>
<tr>
<td>
@Html.LabelFor(x => x.TaskTypeId)
</td>
<td>
@Html.DropDownListFor(x => x.TaskTypeId, Model.GetTaskTypesSelectList(), "Select", new { style = "width: 260px;" })
</td>
</tr>
<tr>
<td>
@Html.LabelFor(x => x.ResponsableId)
</td>
<td>
@Html.DropDownListFor(x => x.ResponsableId, Model.GetResponsablesSelectList(), "Select", new { style = "width: 260px;" })
</td>
</tr>
<tr>
<td>
@Html.LabelFor(x => x.StatusId)
</td>
<td>
@Html.DropDownListFor(x => x.StatusId, Model.GetStatusSelectList(), "Select", new { style = "width: 260px;" })
</td>
</tr>
</table>
</fieldset>
</div>
@Html.Hidden("page")
<input id="btnSearch" type="submit" value="Search" />
}
<br />
<div id="myGrid">
@Html.Partial("_TaskSearchResult", Model.ResultTask)
</div>
<br />
@Html.ActionLink("Create new Task", "NewTask")
因此,如果有人知道如何解决我的问题,我将感激不尽。
So if anyone know how to solve my problem I'll be grateful.
问候语 阿图罗·
推荐答案
我想这是因为你每次点击下页的链接取代了网格。也许用它是这样的:
I think it's because you're replacing the grid each time you click the next page link. Maybe use it something like this:
@model IEnumerable<MVC3.Models.Task>
@{
var grid = new WebGrid(null, rowsPerPage: 2, canPage: true, canSort: true, ajaxUpdateContainerId: "myGrid");
grid.Bind(Model, rowCount: 3, autoSortAndPage: true);
grid.Pager(mode: WebGridPagerModes.All);
<div id="myGrid">
@grid.GetHtml(
columns: grid.Columns(
grid.Column(format: (item) => Html.ActionLink("Assign Notifications", "AssignNotifications", new { id = item.TaskId })),
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { id = item.TaskId })),
grid.Column(format: (item) => Html.ActionLink("Delete", "Delete", new { id = item.TaskId })),
grid.Column("Subject"),
grid.Column("Comment"),
grid.Column(columnName: "Status", header: "Status", format: (item) => item.TaskStatu.Name),
grid.Column(columnName: "StartDate", header: "Start Date", format: (item) => item.StartDate.ToString("MM/dd/yyy")),
grid.Column(columnName: "Deadline", header: "Dead Line", format: (item) => item.Deadline.ToString("MM/dd/yyy"))
)
);
</div>
}
这篇关于天冬氨酸MVC3的WebGrid寻呼和过滤阿贾克斯的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!