级联下拉预填充敲除MVC
级联下拉预填充敲除MVC
提问于 2015-07-17 16:55:05
我在更新详细信息屏幕上，我有一个国家和州下拉列表.I要根据所选国家预填充州下拉列表。在初始页面加载上，我确实有选定的国家，国家集合和选定的国家，所有我需要的是使用AJAX获取州集合。
Country List: <select id="CountryDropdownList" data-bind="options: viewModel.CountryCollection,optionsText:'CountryName',optionsValue:'CountryName',value:viewModel.SelectedCountry"></select>
State List: <select id="StateDropdownList" data-bind="options: viewModel.StateCollection,optionsText:'StateName',optionsValue:'StateName',value:viewModel.SelectedState"></select>
<script>
var viewModel = ko.mapping.fromJS(@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model)));
console.log(viewModel.SelectedState()); //State3 the initial value
viewModel.SelectedCountry.subscribe(function (newSelectedCountry) {
alert(newSelectedCountry);
console.log(viewModel.SelectedState()); //undefined why?
$.ajax({
url: 'Home/GetStateList?Country=' + newSelectedCountry,
success: function (data) {
viewModel.StateCollection(ko.mapping.fromJS(data)());
console.log(viewModel.SelectedState()); //state0 why?
}
})
});
ko.applyBindings(viewModel);
$(function () {
viewModel.SelectedCountry.valueHasMutated();
})
</script>但是，当我尝试通过AJAX请求获取状态列表时，Selected state值被重置，列表中的第一个值成为默认的选定值。我很困惑，为什么KO要更新我的selected State值，而我根本没有更改它？
但是，如果我在AJAX成功回调中再次设置了Selected State，它就能正常工作
viewModel.SelectedCountry.subscribe(function (newSelectedCountry) {
alert(newSelectedCountry);
$.ajax({
url: 'Home/GetStateList?Country=' + newSelectedCountry,
success: function (data) {
viewModel.StateCollection(ko.mapping.fromJS(data.StateCollection)());
viewModel.SelectedState(data.SelectedState);
}
})
});我在找这种奇怪行为的原因。
回答 1
Stack Overflow用户
发布于 2015-07-17 18:06:09
我已经按照您的指示简化了代码，现在我认为它可能会帮助您指出问题。
<script>
var viewModel = ko.mapping.fromJS(@Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model)));
console.log(viewModel.SelectedState()); // o/p state3
$.ajax({
url: 'Home/GetStateList?Country=' + viewModel.SelectedCountry(),
success: function (data) {
viewModel.StateCollection(ko.mapping.fromJS(data)());
console.log(viewModel.SelectedState()); // o/p state0
}
})
ko.applyBindings(viewModel);
</script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/31471897
复制相关文章
相似问题
腾讯云开发者
