値がドロップダウンから選択されたときにコントローラ機能にポストバックする方法

Question

私はビュー上にドロップダウンリストを作成し、リストを表示しました。

@Html.DropDownListFor(m => m.SelectedId, new SelectList(Model.List, "ID", "Name")) 

ユーザーがドロップダウンから値を選択したときにページを更新したいとします。 ボタンをクリックせずに、ドロップダウンから選択したイベントをコントローラー機能にマップする方法がわかりません。

ビューの読み込みには、ビューをリストに入力するコントローラ機能があります。

public ActionResult Populate() 
{ 
    List<string> list = get it from sql server 
    ViewModel viewModel = new ViewModel(); 
    viewModel.list = list; 
    return view(); 
} 

しかし、どのようにあなたがIDとして選択した値を取り、データを取得し、その結果でページを更新しますコントローラの関数を呼び出します。

Answer 1

が頭の中であなたのレイアウトにこれを追加：あなたのビューで

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('select:[autopostback=true],input[type=checkbox]:[autopostback=true],input[type=radio]:[autopostback=true]').live('change',function() { 
      $(this).closest('form').submit(); 
     }); 
    }); 
</script> 

を：あなたは、あなたのドロップダウンリストの選択を変更する場合

@using (Html.BeginForm()) 
{ 
    @Html.DropDownListFor(m => m.SelectedId, new SelectList(Model.List, "ID", "Name"), new { autopostback = "true" }) 
} 

あなたのドロップダウンリストが入っているフォームが提出されます。そのフォームのアクションの結果が同じページであれば、更新中のものがあればそれを再読み込みします

Answer 2

JavaScriptのヘルプなしでは実行できません。 selectイベントにバインドしてフォームを送信するか、ajaxリクエストを作成するだけです。 jQueryのを使用して

：

$('#yourDropDownId').change(function(){ 
    $('#yourFormId').submit(); 
}); 

またはあなたはAJAX呼び出しが提出使用$.postまたは$.getのinsted必要がある場合。

Answer 3

$(document).ready(function() { 
    $("#ddl").change(function() { 
     var strSelected = ""; 
     $("#ddl option:selected").each(function() { 
      strSelected += $(this)[0].value; 
     }); 
     var url = "/Home/MyAction/" + strSelected; 

     $.post(url, function(data) { 
      // do something if necessary 
     }); 
    }); 
}); 

または

<%=Html.DropDownListFor(m => m.SelectedId, new SelectList(Model.List, "ID", "Name"), new { onchange="this.form.submit();" })%> 

Answer 4

それは簡単です。あなたのJavaScriptでは、あなたは持っている：

[AcceptVerbs(HttpVerbs.Get)] 
public JsonResult YourAction(int id) 
{ 
    //do something 
    return Json(ControlToString("~/Views/YourController/YourView.cshtml", yourModelWithData), JsonRequestBehavior.AllowGet); 
} 

そしてControlToStringが定義されています：

$(document).ready(function() { 
      $('#SelectedId').change(function() { 
       var id = $(this).val(); 
       $.getJSON("/YourController/YourAction", { id: id}, 
       function (data) {    
        $("#SomeDivSelector").html(data); 
       }); 
      }); 

     }); 

お使いのコントローラがどのように見えるはずです

private string ControlToString(string controlPath, object model) 
     { 
      //CshtmlView control = new CshtmlView(controlPath); 
      RazorView control = new RazorView(this.ControllerContext, controlPath, null, false, null); 

      this.ViewData.Model = model; 

      using (System.Web.UI.HtmlTextWriter writer = new System.Web.UI.HtmlTextWriter(new System.IO.StringWriter())) 
      { 
       control.Render(new ViewContext(this.ControllerContext, control, this.ViewData, this.TempData, writer), writer); 

       string value = ((System.IO.StringWriter)writer.InnerWriter).ToString(); 
       return value; 
      } 
     } 

よろしく。

Answer 5

あなたが使用しているテクノロジーのコンセプトに反して、あなたが適用したいもの。 ASP.NETテクノロジに基づいたMVCですが、別の方法で実行しています。 MVCはASP.NETのライフサイクルをより良く使用しないので、 "ポストバック"しません。 MVC - アーキテクチャパターンに基づいたルートでは、あらゆるシステムの異なるレイヤーを分離することができるため、現在の技術の開発へのアプローチは全く異なります。 MVCの詳細については、http://www.asp.net/mvc

でも問題を実装したい場合は、ASP.NETコンセプトを使用し、DropDownListコントロールのAutoPostbackプロパティを使用できます。