Обновление Html.Dropdownlists с использованием JQuery

Question

Я нашел это решение здесь Как обновить строго типизированный Html.DropDownList с помощью Jquery и пытаюсь реализовать его, но в нем что-то есть ошибки.

$(function() {
    $('#cid').change(function() {
        var selectedCompany = $(this).val();
        var ddl = $("#foid");
        $.post("/TimeTracking/FilterFieldOffices", { companyId: selectedCompany }, function (data) {
            $(ddl).loadSelect(data);
        });
    });
});

(function($) {
    $.fn.emptySelect = function() {
        return this.each(function() {
            if (this.tagName == 'SELECT') this.options.length = 0;
        });
    }

    $.fn.loadSelect = function(optionsDataArray) {
        return this.emptySelect().each(function() {
            if (this.tagName == 'SELECT') {
                var selectElement = this;
                $.each(optionsDataArray, function(index, optionData) {
                    var option = new Option(optionData.Text, optionData.Value);

                    if ($.browser.msie) {
                        selectElement.add(option);
                    }
                    else {
                        selectElement.add(option, null);
                    }
                });
            }
        });
    }
})(jQuery);

Мой контроллервозвращает список выбора того, что я хочу.

public ActionResult FilterFieldOffices(int companyId = 0)
    {
        IList<FieldOffice> list = _fodp.GetFieldOfficesForCompany(companyId);

        var returnList = new SelectList(list, "Id", "FacilityName");

        return Json(returnList);
    }

Я знаю, что функция .change срабатывает путем размещения предупреждений, и я знаю, что моя функция контроллера вызывается через точки останова, так что сужается доФункция loadselect, однако я больше не могу ее сузить, поскольку в функции выбора нагрузки не сработают оповещения.У меня недостаточно опыта работы с JQuery, чтобы составить мнение о том, что не так.Поэтому я спрашиваю, добился ли кто-нибудь успеха в том, что я пытаюсь сделать, или вы видите что-то не так с кодом.И прежде чем кто-нибудь спросит, да, я проверил скобки.

edit Забыл упомянуть, что я проверил консоль ошибок для Firefox, и я получаю ошибку:

$(ddl).loadSelect is not a function.

edit Найден ресурс, в котором упоминается, что описанная мною ошибка возникает при наличии двух конфликтующих сред.Поэтому я положил в jQuery.noConflict ();и все равно не работает.

Answer 1

Очень странно, но я нашел решение, через которое я могу пробить точку.

<script type="text/javascript">

        $(function () {
            $('#cid').change(function () {
                var coid = $(this).val();
                $.post("/TimeTracking/FilterFieldOffices", { companyId: coid }, function (data) {
                    $("#foid").loadSelect(data); 
                });
            });
        });

        $(function () {
            $.fn.loadSelect = function (data) {
                return this.each(function () {
                    this.options.length = 0;
                    $.each(data, function (index, itemData) {
                        var option = new Option(itemData.Text, itemData.Value);
                        this.add(option);
                    });
                });
            };
        });

    </script>

Все, что мне нужно было сделать, это обернуть функцию, которая не была вызвана в $ (function (){// Код здесь});Однако у меня все еще есть некоторые проблемы.Я создал для него новую страницу.

Обновление выпадающего списка после сброса элементов