Javascript 在ASP.NET WebForms服务器端帖子之间持久化淘汰ViewModel。。。

以CodeProject.com上的这篇文章为指导，我试图使用ASP.NET 3.5 Web表单创建一个可重用的、加载数据的下拉列表，但它利用KnockoutJS进行客户端数据绑定。此下拉列表的多个独立实例应该能够独立存在于同一页面中

到目前为止，CodeProject.com的帖子在指导我如何设置方面非常有用，我正在成功地将更新后的ViewModel数据作为JSON字符串在服务器和客户端之间来回传递，并将其转换为对象（在服务器和客户端上）。我挂断的是什么应该是简单的部分；将ViewModel绑定到下拉列表

因此，我首先将JSON字符串加载到一个隐藏字段中。它包括一个区域列表和一个选定区域

<input type="hidden" id="ddlRegionKO_hdnRegionListVMStorage" value="{&quot;Regions&quot;:[{&quot;RegionName&quot;:&quot;Mid Atlantic USA&quot;,&quot;RegionId&quot;:2},{&quot;RegionName&quot;:&quot;Mid West USA&quot;,&quot;RegionId&quot;:10},{&quot;RegionName&quot;:&quot;North Central USA&quot;,&quot;RegionId&quot;:5},{&quot;RegionName&quot;:&quot;North East USA&quot;,&quot;RegionId&quot;:1},{&quot;RegionName&quot;:&quot;North West USA&quot;,&quot;RegionId&quot;:7},{&quot;RegionName&quot;:&quot;Other&quot;,&quot;RegionId&quot;:9},{&quot;RegionName&quot;:&quot;South Central USA&quot;,&quot;RegionId&quot;:6},{&quot;RegionName&quot;:&quot;South East USA&quot;,&quot;RegionId&quot;:3},{&quot;RegionName&quot;:&quot;South West USA&quot;,&quot;RegionId&quot;:8}],&quot;SelectedRegion&quot;:{&quot;RegionName&quot;:&quot;North Central USA&quot;,&quot;RegionId&quot;:5}}" />

然后我将属性定义转换为

ko.observable

和

ko.observableARay

方法（这是需要重构的部分之一，但作为概念证明就足够了）

鉴于此，我希望在调用

applyBindings

方法时填充下拉列表并选择SelectedRegion

ko.applyBindings(ddlRegionKO_pnlRegionDDLContainer_ViewModel);

我在JSFIDLE把这些都放在了一起。。。我怀疑我可能忽略了什么，但我看不到它可能是什么。我觉得一切都很好

如果有人能看到我忽略的东西，我将不胜感激

谢谢

---

-g

您不需要在绑定中指定模型名称。不要使用

选项：ddlRegionKO\u pnlRegiondLcontainer\u ViewModel.Regions

，只需使用

选项：Regions

，等等

<select id="ddlRegionKO_ddlRegionList" 
    data-bind="options:Regions, 
        optionsText:'RegionName', 
        optionsValue:'RegionId',
        value:SelectedRegion, 
        optionsCaption:'Choose Region ...'">
</select>

只要：

'SelectedRegion':5

---

。但这对文本框的情况没有帮助，因为它将显示ID而不是文本框中的文本。现在已经有点晚了，所以我不确定如何立即解决这个问题，但你可能会寻找一些灵感。祝你好运。

谢谢！我对您的答案投了更高的票，因为我不知道“optionsValue”属性，它从Json数据中获取加载了区域列表的下拉列表。但这只是半途而废。基于绑定，我希望SelectedRegion在下拉列表中被预先选择（它在ModelView中定义）。此外，当我尝试将文本框绑定到下拉列表（data bind=“text:SelectedRegion（）.RegionName”）时，什么也不会发生。所以我定义“SelectedRegion”的方式可能有问题？再次感谢@GaryO Stenstrom抱歉我第一次没看到。请参阅我的编辑。长话短说，我的解决方案将设置选定值，但您必须深入了解如何将选定值绑定到对象。看看我提供的链接，看看是否有帮助，或者开始阅读淘汰文档。我在JSFIDLE（）中添加了一个绑定文本框，但它只在IE中工作，不在任何其他浏览器中工作。@GaryO.Stenstrom对于控件，您使用

data bind=“value:SelectedRegion”

。对于html元素（div、span等），您可以使用

databind=“text:SelectedRegion”

谢谢！！我想。。。我希望。。。我现在已经准备好了。

<select id="ddlRegionKO_ddlRegionList" 
    data-bind="options:Regions, 
        optionsText:'RegionName', 
        optionsValue:'RegionId',
        value:SelectedRegion, 
        optionsCaption:'Choose Region ...'">
</select>

<input type="hidden" 
    id=".."
    data-bind="..a bunch of array stuff...  ,&quot;SelectedRegion&quot;:5}" 
/>

'SelectedRegion':{'RegionName':'North Central USA','RegionId':5}

'SelectedRegion':5