Question

我有一个包含不同类型列表的ViewModel

首次加载页面时，我想根据所选的下拉列表显示数据列表。

当下拉更改时，我想显示特定于该类型的数据列表。

但是我不想去我的控制器，因为在那种情况下我需要进行搜索/查询，因为我在视图中已经拥有了所有类型。

我该怎么做？

任何建议。

谢谢，

Answer 1

如果您不想去服务器（ajax \ submit），那么您需要下载所有数据（在第一个响应中）并使用javascript更改列表。

当选择框change出现时，您需要获取所选值并更新新列表以对其起作用。

以下是一个例子：

HTML：

<select id="s1"></select>
<select id="s2"></select>

JS：

var currData = ["1", "2", "3"];
var otherData = [
    ["a", "b", "c"],
    ["d", "e", "f"],
    ["g", "h", "i"]
]


for (var i = 0; i < currData.length; i++) {
    var option = $('<option value="' + currData[i] + '">' + currData[i] + '</option>');
    $("#s1").append(option);
}
// s1 and s2 are the same when the page loads.
$('#s2').html($('#s1').html());

$('#s1').change(function () {
    var idx = currData.indexOf($(this).val());
    var newSelectData = otherData[idx]; // change s2 due to s1's selection
    $('#s2').children().remove(); // clear the s2 select box
    for (var i = 0; i < newSelectData.length; i++) {
        var option = $('<option value="' + newSelectData[i] + '">' + newSelectData[i] + '</option>');
        $("#s2").append(option);
    }
});

JSFIDDLE

刷新视图/部分视图而不使用Ajax或在MVC中提交

1 个答案: