0

ユーザーがajaxでドロップダウン値を変更したときにグリッドの日付を変更したい。これは私のC#コードです:

public ActionResult Index(string name)
    {
        ViewBag.Drop = db.Students.Select(r => r.Fname);
        var model = from r in db.Students
                    where r.Fname == name
                    select r;

        return View(model);
    }

これはcshtmlファイルです:

 @using (Ajax.BeginForm("Index", new AjaxOptions
    {
        UpdateTargetId = "grid",

        HttpMethod = "GET"
    }
        ))
    {

         @Html.DropDownList("name", new SelectList(ViewBag.Drop));
         <input type = "submit" value = "submit" />
    }
    <div id= "grid">

    </div>

私の問題は、ドロップダウン値を変更すると、すべてのビューが再び表示されることです。新しいビューは表示したくないので、グリッドデータを変更したいだけです。どうやってやるの?

4

1 に答える 1

0

Grid データのみを返すアクション メソッドはありますか? そうでない場合は作成します

public ActionResult GridData(string name)
{
   var gridItems=repo.GetCustomers(name).ToList();   
   //the above method can be replaced by your 
   // actual method which returns the data for grid

    return View(model);
}

私は単に、呼び出されたプロパティを持つ Customer モデルがありFirstNameLastNameグリッドに Customers のリストを表示したいと仮定しています。それらを実際のクラス名とプロパティに置き換えることができます。

GridData.cshtmlグリッドの HTML マークアップをレンダリングするというビューがあることを確認してください

@model IEnumerable<YourNameSpace.Customer>
@{
  Layout=null;
}
<table>
@foreach(var item in Model)
{
  <tr><td>item.FirstName</td><td>item.LastName</td></td>
}

を使用する代わりに、以下のよう な単純な(そしてクリーンな) コードを記述します。Ajax.BeginForm

@Html.DropDownList("name", new SelectList(ViewBag.Drop));
<div id= "grid"></grid>

<script type="text/javascript">
 $(function(){

   $("select[name='name']").change(function(){
      var url="@Url.Action("GridData","YourControllerName")"+"?name="+$(this).val();
      $("#grid").load(url);
   });   

 });    
</script>
于 2012-06-21T21:42:55.827 に答える