0

これが私のアクションメソッドです

 public ViewResult Index(string firstName)
        {
            // get the list of employees according to the user name
            if (firstName == null)
            {
                return View((from e in db.Employees
                             where e.IsActive == true
                             select e).ToList());
            }
            else
            {
                return View((from e in db.Employees
                             where e.IsActive == true && e.FirstName.Contains(firstName )
                             select e).ToList());
            }
        }

これが私の見解です

@{         

   var grid = new WebGrid(source: Model,
                defaultSort: "UserName",
                rowsPerPage: 15, ajaxUpdateContainerId: "grid"); 
}
@using (Html.BeginForm())
{
   <div class="btn_align">
        @if (Request.IsAuthenticated && HttpContext.Current.User.IsInRole("Administrator"))
        {
            <h2>@Html.ActionLink("Create New", "Create")</h2>
        }
   </div>

   <div class="btn_align">
        <p>
            Find by name:<input class="inputStyle_S" id="firstName" name="firstName" type="text" value="" data-autocomplete= "@Url.Action("QuickSearchFirstName", "ApplyLeave")" />  
            <input type="submit"  id="txtSearch" value="Search"  class="btn"/>
        </p>
   </div>

    <div id="grid">
        @grid.GetHtml(
                tableStyle: "grid",
                headerStyle: "head",
                alternatingRowStyle: "alt",
                columns: grid.Columns(
                 grid.Column("User Name", format: (item) => item.FirstName + ' ' + item.LastName),     
                        grid.Column("EmployeeType.Type", "Employee Type"),
                        grid.Column(header: "Action", format: (item) =>
                             Html.ActionLink("Details", "Details", new { id = item.id}))
            )
        ) 
    </div>
}
</div>
<div class="leaveChart_bottom"></div>

検索ボタンを送信した後、ページを更新せずに検索結果をexixtingグリッドに取得したいデータを表すためにWebグリッドを使用しました（名前で検索）

これは私が使用した ajax メソッドですが、機能していません。

4

1 に答える 1

0

@Ajax.BeginForm を使用する必要があります。これにより、ページを更新せずにグリッドが更新されます。サーバー側でRenderHtmlStringを取得できるように、Grid の部分クラスを作成します。

PartailClass で

//GridPartail.cshtml @model SomeModel

@{         

   var grid = new WebGrid(source: SomeModel,
                defaultSort: "UserName",
                rowsPerPage: 15, ajaxUpdateContainerId: "grid"); 
}
<div id="grid">
        @grid.GetHtml(
                tableStyle: "grid",
                headerStyle: "head",
                alternatingRowStyle: "alt",
                columns: grid.Columns(
                 grid.Column("User Name", format: (item) => item.FirstName + ' ' + item.LastName),     
                        grid.Column("EmployeeType.Type", "Employee Type"),
                        grid.Column(header: "Action", format: (item) =>
                             Html.ActionLink("Details", "Details", new { id = item.id}))
            )
        ) 
    </div>

ビューを変更しました

@using (@Ajax.BeginForm("Index", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "gridResult" }))
{

<div class="btn_align">
        @if (Request.IsAuthenticated && HttpContext.Current.User.IsInRole("Administrator"))
        {
            <h2>@Html.ActionLink("Create New", "Create")</h2>
        }
   </div>

   <div class="btn_align">
        <p>
            Find by name:<input class="inputStyle_S" id="firstName" name="firstName" type="text" value="" data-autocomplete= "@Url.Action("QuickSearchFirstName", "ApplyLeave")" />  
            <input type="submit"  id="txtSearch" value="Search"  class="btn"/>
        </p>
   </div>

   <div id="gridResult">
      @html.Partail("GridPartail",Model)
   </div>

}

注: Html.BeginForm を使用する代わりに Ajax.BeginForm.in を使用して、テキスト ボックスをモデルにバインドしていないため、formCollectionで値を取得します。

コントローラー内

[HttpPost]
public ActionResult Index(formCollection coll)
        {
            string firstName = coll["firstName"];
            // get the list of employees according to the user name
            if (firstName == null)
            {
               var result = from e in db.Employees
                             where e.IsActive == true
                             select e).ToList();

                return PartailView("GridPartail",result );
            }
            else
            {
                //"GridPartail.cshtml" is partial viewName
                var result = (from e in db.Employees
                             where e.IsActive == true && e.FirstName.Contains(firstName )
                             select e).ToList();
                return View("GridPartail",result );
            }

        }

AjaxOption のように、アクション メソッドPOSTについて言及しており、結果がビューに表示される場所を指定するUpdateTargetIdを渡す必要があります。

于 2012-10-02T11:42:04.500 に答える