javascript - MVC Dropdownlist 填充另一个下拉列表

标签 javascript jquery model-view-controller drop-down-menu

在 MVC 中创建了一个包含 2 个输入字段和 3 个级联下拉列表的表单。

下拉列表可以很好地填充每个结果,我的问题是当下拉列表仅拉回一个结果时,它不允许我选择该结果来填充对应的下一个下拉列表。

Jquery 代码,

  var server = "";
    function populateDropdown(dropdownId, requestPath, requestData, valueFunction, textFunction) {
        var dropDown = $("#" + dropdownId);
        dropDown.val(null);
        dropDown.empty();
        $.getJSON(requestPath, requestData, function (data) {

            if (!data || !data.result)
                return;

            $.each(data.result, function (index, object) {
                dropDown.append($("<option />").val(valueFunction(object)).text(textFunction(object)));
            });
        });
    }

    $(document).ready(function () {
        $("#serverTextbox").blur(function () {
            var newServer = $.trim($(this).val());
            if (newServer === server)
                return;
            server = newServer;
            populateDropdown('usersCombo', 'LoadUsers', { server: server },
                function (object) { return object; },
                function (object) { return object; });
        });

        $("#usersCombo").change(function () {
            var user = $.trim($(this).val());
            populateDropdown('databaseCombo', 'LoadDatabases', { server: server, user: user },
                function (object) { return object; },
                function (object) { return object; });
        });

        $("#databaseCombo").change(function () {
            var database = $.trim($(this).val());
            populateDropdown('companyCombo', 'LoadCompanies', { server: server, database: database },
                function (object) { return object; },
                function (object) { return object; });
        });
    });

这也是我的问题,

Issue with dropdownlists

enter image description here

最佳答案

如果只有一个结果,则在附加选项后触发更改:-

function populateDropdown(dropdownId, requestPath, requestData, valueFunction, textFunction) {
  var dropDown = $("#" + dropdownId);
  dropDown.val(null);
  dropDown.empty();
  $.getJSON(requestPath, requestData, function(data) {

    if (!data || !data.result)
      return;

    $.each(data.result, function(index, object) {
      dropDown.append($("<option />").val(valueFunction(object)).text(textFunction(object)));
    });

    if (data.result.length == 1) {
      dropDown.trigger('change');
    }
  });
}

关于javascript - MVC Dropdownlist 填充另一个下拉列表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36622906/

相关文章:

php - 从 json 结果创建嵌套 div

jquery - 使用 jQuery 切换图像 src

java - 最佳实践 - 从 View 访问域对象列表?

javascript - Nextjs 静态页面动态路由给出 `paths` 必须是字符串或对象数组...错误

javascript - 无法使用 Node.js 解析 Firebase 的快照

javascript - 在输入上定义表单控件时,NgModel.viewToModelUpdate 不起作用

javascript - 根据设备宽度改变样式

javascript - 如何从我的 HTML/JavaScript 应用程序中引用 jQuery?

asp.net-mvc - 我什么时候应该避免使用强类型 View 数据?

ruby-on-rails - 在 Rails 中,是否可以将显示 View 用作编辑 View ?