ASP.NET MVC 3 DropDownList selectedindexchanged

Question

私はユーザーが自分のステータスコードに基づいてレコードをフィルタできるようにする機能を持っています。メニューでは、私は、カスタムフィルタセクションがあります。

<h3>Custom Filters</h3> 
<br /> 
    <ul id="ui-ajax-tabs"> 
     @{ Html.RenderAction("GetGroups", "Manage");} 
    </ul> 

をそして、私の部分図は次のようになります。アイテムがドロップダウンリストから選択される

@model IEnumerable<AllEngage.Model.Group> 

@using AllEngage.Web.Helpers 

@foreach (var group in Model) 
{ 
    <li> 
     <label for="@group.GroupName">@group.GroupName</label> 
     @Html.DropDownList("GroupItems", group.GroupItems.ToSelectListItems()) 
    </li> 
} 

が、私は火にアクションメソッドをしたいです私のコントローラ：

[HttpGet] 
public ActionResult Index(int page = 1, int groupFilterId = -1) 

どうすればいいですか？ jsonを使って火をつけたり、何とかポストバックをしたりしますか？

Answer 1

あなたは行動にパラメを渡す必要があります。これを行うにはfastes方法 - アクションでのparamと同じ名前のクエリ文字列を経由して渡す：ドロップダウンコントロールのonchangeを解雇されますwhitchのparamでAJAXリクエストを送信する必要があり、それを更新するには

http://mysite/GetGroups?groupFilterId=2 

。あなたのフィルタ制御のためのいくつかのIDを指定します。

@Html.DropDownList("GroupItems", group.GroupItems.ToSelectListItems(), new {@id="ddlFilter"}) 

してからデータのGET要求を行うjQueryのを使用して：

$('#ddlFilter').change(function() { 
    var queryLink = '@Url.Action("GetGroups")'; 
    if ($(this).val() != '') { 
     queryLink += '?groupFilterId=2'; 
    } 

    $.get(queryLink, function(data) { 
     $('#ui-ajax-tabs').html(data); 
    }); 
}); 

Answer 2

ドロップダウンのクリックイベントにjqueryのを使用して、AJAX呼び出しを発射する必要があります。 値が変更された場合、最初のクリックイベントでドロップダウンのjquery ajaxコールを呼び出す jqueryのコードを貼り付けています。

$.get("/Wk/Revision/@hTitle/@pageID/?langID=2", function (data) { 
        $("div#dAjaxContent").html(data); 
        $("div#dShow").css("visibility", "visible"); 
        $("#dShow").dialog(); 
       }); 

//これはajaxコール用です。ドロップダウンチェックはあなた自身で行います。 "/ Wk/Revision/@ hTitle/@ pageID /？langID = 2" コントローラメソッドのリビジョンが呼び出されます。 そして次に私はあなたがすると思います。

Answer 3

投稿リクエストを行うことをおすすめします。あなたはAJAX要求を取得作ることができる、またはあなたが離れてリダイレクトしたい場合、あなたはのように、あなたが望む行動を指すようにはJavaScriptのwindow.locationのを変更することができます

http://iridescence.no/post/Invoking-ASPNET-MVC-Actions-from-JavaScript-using-jQuery.aspx

：あなたはこれを使用したものを構築することができます：