2012-01-20 126 views
4

我有一個Asp.Net MVC3的WebGrid控制問題。我想要的是使用ajax和webgrid執行搜索視圖;是這樣的:Asp Mvc3 webgrid調頁和過濾通過ajax

搜索條件_ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __

Subject:_ __ _ _

任務類型:_ ____

提交搜索


的WebGrid withPaging

當我點擊按鈕搜索時,它通過ajax調用HTTPost動作並應用搜索條件;但是,當我嘗試進行分頁時,它會轉到HTTPGet操作;以這種方式,根據搜索標準的過濾器不執行。

我把網格放在一個局部視圖中;有代碼:

@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")) 
      ) 
    ); 
} 

我的索引視圖的樣子:

@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") 

所以如果有人知道如何解決我的問題,我將不勝感激。

問候 阿圖羅

+0

我有同樣的問題 - 任何運氣? http://stackoverflow.com/questions/8999390/mvc-3-webgrid-paging-doesnt-return-orginal-search-results –

+0

這裏是我使用的解決方案。 http://forums.asp.net/t/1742017.aspx/1 –

回答

0

我想這是因爲你每次點擊下頁鏈接替換網格。也許使用它是這樣的:

@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> 
} 
+0

我不明白這將如何幫助傳遞過濾條件回來?網格生成要調用的URL,其中包括排序列,排序方向和頁碼(如果它是分頁器的話),因此您需要以某種方式增加該值。 – jwsadler

1

看到的網格生成一個onclick呼籲各尋呼機項目(和列標題)不能你剛纔使用jQuery來替代默認值與調用一個Ajax方法通過表單回來?