MVC动态内容onchange下拉列表

时间:2013-05-21 12:13:58

标签: c# jquery asp.net-mvc

我有一个关于如何实现以下目标的问题:

我有一个包含活动的下拉列表,我希望在活动的onchange事件中,我的列表将使用在我的模型中使用ajax设置的id获取

我的代码示例如下

用于设置ID的Ajax方法

 function GetSelectedValue(DropDownID, HiddenFieldID) {

    $('#' + HiddenFieldID).val($('#' + DropDownID + ' option:selected').val());

    $('#' + DropDownID).change(function () {
        $('#' + HiddenFieldID).val($('#' + DropDownID + ' option:selected').val());

        $.ajax({
            url: 'Afmeldingen',
            type: "POST",
            data: JSON.stringify({ 'ActiviteitenID': $('#' + DropDownID + ' option:selected').val() }),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                jQuery.globalEval(data.Callback);
            },
            error: function (error) {
                //alert(error);
            }
        });
    });
}
$(document).bind('pageinit', function () {
    GetSelectedValue('details', 'act_id');
});

表单元素

@using (Html.BeginForm())
{
    <div data-role="collapsible" data-inline="true" data-content-theme="b" data-collapsed="false">
        <h3>@DateTime.Today.ToShortDateString()</h3>
        <div data-role="collapsible-set" data-inline="true" data-content-theme="b" data-collapsed="true">
            <select id="details">
                @foreach (var item in Models.Taken.ActivityList)
                {
                    <option value="@item.ID">@item.Comments</option>
                }
            </select>
            @Html.Hidden("act_id")
            @foreach (var item in Talent.Subscription.Fetch(null, Models.Taken.ActID ?? 1L, null, null))
            {
                <div data-role="collapsible" data-content-theme="b" data-collapsed="true">
                    <h3>
                        @Html.Label("", item.Participant.CompleteName)
                    </h3>
                    @Html.CheckBoxFor(m => m.DeelnemerActive.HasValue, htmlAttributes: new { data_role = "CheckBox" })
                    @foreach (var af in Talent.Afmelding.Fetch(null, Models.Tasks.ActID ?? 1L, null, null))
                    {
                        @Html.Label("", "Comments")
                        @Html.TextBox("Reason", af.Reason);
                    }
                </div>
            }
        </div>
    </div>
}

我希望你能帮助我实现这一目标,或者你知道如何做到这一点

1 个答案:

答案 0 :(得分:4)

  

这可能是我能找到的最有帮助你的例子。

     

http://blog.krisvandermast.com/CommentView,guid,b1a264ac-c48f-463e-9f55-db24e2a9b635.aspx

     

他在onclick上动态加载部分视图中的数据   按钮。你可以在这里使用你的onchange。

-

  

查看此示例,了解级联下拉列表的工作原理:

     

http://www.c-sharpcorner.com/UploadFile/abhikumarvatsa/cascading-dropdownlist-in-Asp-Net-mvc/

-

  

你也可以考虑使用淘汰赛js,如下所述:

     

http://www.dotnetexpertguide.com/2012/06/cascading-dropdown-knockoutjs-aspnet.html