Question

我有3个表国家，州，城市。

我像往常一样想要级联下拉列表。

如果不使用LINQ，我该怎么做呢。

我不知道如何开始。我想用RAZOR做到这一点。如果是在JQUERY或JSON中，也没关系。

如何开始。

提前致谢。

我可以使用存储过程吗？

表格是： -

用户：

名 cityid

国家：

id stateid name

州

stateid cityid名称

城市

cityid名称。

我没有尝试过，因为我不知道从哪里开始。

Answer 1

创建级联选择的一般方法

创建包含要显示的属性的视图模型，包括国家/地区ID的属性和国家/地区选项的SelectList

在您的视图中，渲染选择使用@HtmlDropDownFor()作为国家，国家和地产ID（国家/地区选择将被填充;其他将为空）

使用jQuery，在Country change事件中，对一个action方法使用AJAX调用，该方法根据所选的Country返回一个States列表（返回html以替换City select，或返回JSON以创建一组新的选项元素。

选择状态时重复上述步骤（填充城市选择）

Answer 2

这里没有人会为您提供完整的代码，就像您在问题中提出的那样，但下拉的使用情况如下所示：

在MVC中进行下拉列表的基本和最简洁的方法如下：

型号：

public List<SelectListItem> ItemTypes { get; set; }
public int ItemVal { get; set; }


In your [HttpGet] Controller just bind `Model.ItemTypes` with values

查看：

@Html.DropDownListFor(m => m.ItemVal , new SelectList(Model.ItemTypes , "Value", "Text"), "  -----Select List-----  ")

这里是上面的例子DropDownListFor（）的第三个重载，即＆＃34; -----Select List-----＆＃34;将是您的下拉列表的初始选定项目，其值等于＆＃39; ＆＃39;

在POST期间，在ItemVal中，ItemVal将选择下拉值。

上面显示的代码是在MVC中绑定Dropdownlist的最佳和最简单的方法。

Answer 3

见这个例子。你会有一个想法。我只是展示未经测试的样品。

    public ActionResult Index()
    {
        var countries = new List<string> { "USA", "India" };

        ViewBag.Countries = new SelectList(countries);

        return View();
    }

    public ActionResult GetStates(string country)
    {
        //perform filter here based on country
        return Json(new[] {
            new { Id = 1, Value = "State 1" },
            new { Id = 2, Value = "State 2" },
            new { Id = 3, Value = "State 3" },
        }, JsonRequestBehavior.AllowGet);
    }

查看页面

<div>Select country:</div>
<div>@Html.DropDownList("country",
                            ViewBag.Countries as SelectList,
                            "Please select",
                            new { id = "country" })
</div>
<div>Select state:</div>
<div>
    <select id="state"></select>
</div>

在国家/地区选择中，执行ajax调用并获取相关状态。

<script type="text/javascript">
    $(function () {
        $('#country').on('change', function () {
            $.getJSON('@Url.Action("GetStates")', function (result) {
                var ddl = $('#state');
                ddl.empty();
                $(result).each(function () {
                    $(document.createElement('option'))
                        .attr('value', this.Id)
                        .text(this.Value)
                        .appendTo(ddl);
                });
            });
        });
    })
</script>

MVC 4 Razor中的级联下拉列表

3 个答案: