0

我还在学习MVC4。

想象以下场景:我有三个 dropDownLists 和一个用于内容的大 div。我不知道如何处理按需加载。

流程很简单,页面加载后,在第一个下拉列表中显示数据。当这个有值时,第二个应该按需加载信息(使用从ddl1中选择的值)等等,直到改变ddl3上的值并显示数据。

直到这里我已经检测到两个部分视图。我不确定是否应该创建 5,因为每个 ddl 都必须在一个局部视图中。

另一件事,你会推荐什么来维护SelectList,我应该ViewBag在viewModel中使用还是维护foreach ddl的集合?

在此处输入图像描述

我只是想知道您是否可以澄清这种情况。我的意思是,给我一个想法,我该如何开始这样做?事实上,我忘了提到这个疑问,但如果我必须使用 AJAX,我不会。

4

1 回答 1

0

几周前我陷入了同样的困境:-

让您的 MVC 调用如下:-

    private void LoadDropdown1()
    {
        var _data;//Your logic to get the data
        ViewData["Dropdown1"] = new SelectList(_data, "Dropdown1Id", "Name");
    }
    private void LoadDropdown2(int dropdownParameterId)
    {
        var _data = "";//Use your ID to get the data
        ViewData["Dropdown2"] = new SelectList(_data, "Dropdown2Id", "Name");
    }

你的 .cshtml 是:-

@using (Html.BeginForm())
{
    <div>
        <table>
            <tr>
                <td><b>Select a District:</b></td>


                <td>@Html.DropDownListFor(m => m.Dropdown1Id, ViewData["Dropdown1"] as IEnumerable<SelectListItem>, "Select One", new {@id="Dropdown1Id"})</td>
            </tr>
            <tr>
                <td><b>Select:</b></td>

                <td>@Html.DropDownListFor(m => m.Dropdown2Id, ViewData["Dropdown2"] as IEnumerable<SelectListItem>, "Select One")</td>
            </tr>
        </table>
    </div>
}

现在 AJAX 调用最好将数据加载到您的下拉列表中:-

$(function () {
    $('select#Dropdown1').change(function () {
        var id = $(this).val();


        $.ajax({
            url: 'Bla Bla',
            type: 'POST',
            data: JSON.stringify({ id: id }),
            dataType: 'json',
            contentType: 'application/json',
            success: function (data) {
                $.each(data, function (key, data) {
                    $('select#Dropdown1').append('<option value="0">Select One</option>');
                    // loop through the LoadDropdown1 and fill the dropdown
                    $.each(data, function (index, item) {
                        $('select#Dropdown1').append(
                            '<option value="' + item.Id + '">'
                            + item.Name +
                            '</option>');
                    });
                });
            }
        });
    });
});

我想说的是.. 以您喜欢的方式加载您的第一个下拉列表。然后在第一个下拉列表的更改事件中,您可以触发一个 ajax 调用来获取第二个下拉列表的数据......同样......

参考: -在选择更改事件 - Html.DropDownListFor

于 2013-02-22T06:12:14.257 回答