级联下拉列表Javascript错误(对象不支持属性)

时间:2013-08-27 20:45:33

标签: javascript jquery asp.net-mvc asp.net-mvc-4

所以我试图使用Jquery在MVC4中实现级联下拉列表。我经历了无数的例子,还没有找到一个有效的解决方案。我正在尝试Cascading drop-downs in MVC 3 Razor view

上列出的解决方案

但我一直收到错误:Microsoft JScript运行时错误:对象不支持属性或方法'cascade'

这是我的代码。

Javascript功能:

   (function ($) {
    $.fn.cascade = function (options) {
        var defaults = {};
        var opts = $.extend(defaults, options);

        return this.each(function () {
            $(this).change(function () {
                var selectedValue = $(this).val();
                var params = {};
                params[opts.paramName] = selectedValue;
                $.getJSON(opts.url, params, function (items) {
                    opts.childSelect.empty();
                    $.each(items, function (index, item) {
                        opts.childSelect.append(
                            $('<option/>')
                                .attr('value', item.Id)
                                .text(item.Name)
                        );
                    });
                });
            });
        });
    };
})(jQuery);

然后你应该简单地将它链接到View上:

<script type="text/javascript">
    $(function () {
        $('#ClientId').cascade({
            url: '@Url.Action("ImportList")',
        paramName: 'clientProjectName',
        childSelect: $('#ImportId')
        });
    });
</script>
<div>
    Client:
    @Html.DropDownListFor(x => x.ClientId, new SelectList(Model.ClientProjects, "ClientProjectName", "ClientProjectName"))
</div>

<div>
    Imports: 
    @Html.DropDownListFor(x => x.ImportId, Enumerable.Empty<SelectListItem>())
</div>

我只想快速,轻松地获得Cascading Dropdown的工作方式,但我尝试的所有内容似乎都无法正常工作。我是MVC4和javascript的新手,所以任何完整的解释都非常感谢。

0 个答案:

没有答案