MVCのドロップダウン変更でアクション名を呼び出す方法は？

Question

最初のドロップダウンリストを選択して2番目のドロップダウンリストにデータをバインドするにはどうすればよいですか？

強く型付けされたビューを使用して最初のドロップダウンリストをバインドしました。

ここで、アクション名を呼び出して、選択肢の最初のドロップダウンリストに2番目のドロップダウンリストをバインドする方法を教えてください。

<tr> 
      <td>Select Make:</td> 
      <td>@Html.DropDownListFor(m => m.SelectedMake, Model.MakesList, new { @class = "form-control", @onchange = "FillModel()" })</td> 
     </tr> 
     <tr> 
      <td>Select Model</td> 
      <td>@Html.DropDownListFor(m => m.SelectedMake, Model.MakesList)</td> 
     </tr> 

アクション名

public ActionResult FillModel(int MakeId) 
     { 
      var makedata = objVehicleContext.VehicleMakes.Where(m=>m.MakeId==MakeId); 

      ViewBag.makelist = makedata.ToList(); 
      return View(); 
     } 

Answer 1

ドロップダウンリストの変化にjQueryの機能を置くことができます。例

<tr> 


     <td>Select Make:</td> 
       <td>@Html.DropDownListFor(m => m.SelectedMake, Model.MakesList, new { @class = "form-control", @onchange = "FillModel()", id="ddlMake" 

    })</td> 
     </tr> 
     <tr> 
      <td>Select Model</td> 
      <td>@Html.DropDownListFor(m => m.SelectedMake, Model.MakesList,new {@id="ddlModel"})</td> 
     </tr> 

のためにこれは、ドロップダウンの変更にアクションメソッドを呼び出すためのシンプルなソリューションです。

$(document).ready(function(){ 
    $("#ddlMake").change(function(){url.action('Controller Name','Action Method Name')}) 
}) 

しかし、あなたはAjax呼び出しメソッドを呼び出してデータを取得する必要があり、さらに効果のために。その後、メソッドの成功時に残りのData On ddlModelを追加する必要があります。ちょうどそれのように。

$(document).ready(function(){ 

    $("#ddlMake").change(function(){ 
    $.ajax({ 
     type:'POST', 
     url:'url.action('Controller Name','Action Method Name')' 
     data:{id:$('#ddlMake').val()}, 
     sucess:{ 
      $("#ddlModel").append('<option value="' + ModelId.Value + '">' + Model.Text + '</option>'); 
     } 
     });)}) 
     }) 

、あなたはコントローラ

public JsonResult GetModel() 
    { 
     //your dropdown datasource 
     return json(ddlModeldatasurce,JsonRequestBehavior.AllowGet); 
    } 

Answer 2

でこれを行う必要があり、私はあなたの質問が正しい理解場合次に、あなただけのシンプルなjquery.postに

$("#ddlMake").change(function() { 
      $.post("controller/ActionName", function (data) { 
       $.each(data, function (val, txt) { 
        $("#ddlModel").append('<option value="' + val + '">' + txt + '</option>'); 
       }); 
      }); 
     }); 

を行う必要がありますコントローラ内：

public Actionresult GetModel() 
    { 
     //your dropdown datasource 
     return json(ddlModeldatasurce); 
    }