[KnockoutJS] TextBox& ListBox未正确更新 [英] [KnockoutJS] TextBox & ListBox not updating correctly

问题描述

这是http://jsfiddle.net/j74pqqat/24/



我们似乎可以让文本框3正常工作。



对文本框3的期望是它会初始化以显示ListBox中的第一个席位，即ListBox中的Steve和Steve高亮显示。 />


下拉3应该显示史蒂夫的三明治。然后在列表框中选择文本框3和下拉列表3将更改为在列表框中显示所选项目。



如果我们对文本框进行更改3 ListBox应突出显示更改，文本框1应显示新名称和餐点



示例：



文本框1 =史蒂夫

文本框2 =伯特



列表框



Steve

Bert



如果我点击文字框1，第三个文本框应改为史蒂夫



如果我在文本框3中将Steve改为Mary，那么ListBox应该显示Marythe Text Box 1应该显示Mary



如果我将文本框1从Mary更改为Bob然后将ListBox和文本框3更改为Bob

Here's the http://jsfiddle.net/j74pqqat/24/

We can seem to get the Text Box 3 to work correctly.

The expectation for the Text Box 3 is that it would initialize to show the first seat in the ListBox which would be "Steve" and also "Steve" highlight in the ListBox.

And the drop down 3 should show the sandwich for Steve. Then selecting in the ListBox the Text Box 3 and the drop down 3 would change to show the selected item in the ListBox.

And if we make a change to Text Box 3 the ListBox should highlight the change and the Text Box 1 should show the new name and meal

Example :

Text Box 1 = Steve
Text Box 2 = Bert

ListBox

Steve
Bert

If I click Text Box 1 the third text box should change to Steve

If I change Steve to Mary in the text box 3 then the ListBox should show Marythe Text Box 1 should show Mary

If I change Text Box 1 from Mary to Bob then the ListBox and Text Box 3 would change to Bob

推荐答案

有几个问题，主要是当你点击史蒂夫或伯特你绑定你的 selectedSeat 到座位的名称而不是座位本身，因为你在绑定中有 optionsValue：'name'。



selectedSeat 也将是 undefined ，因为列表框中没有任何内容被选中。虽然您自己初始化它，但在数据绑定运行后它将被清除。因此，您需要处理在处理 Tex Box 3的绑定时没有选定项目的情况



在处理observable时你还需要使用括号，所以你需要使用<$代替

There are a couple of issues, the main on being that when you click on either Steve or Bert you are binding your selectedSeat to the seat's name rather than the seat itself because you have optionsValue: 'name' in the binding.

selectedSeat will also be undefined because nothing in the list box is selected. Though you initialise it yourself, after the data bindings run it will be cleared out. So you need to handle the case where there is no selected item when dealing with the bindings for Tex Box 3

You also need to use brackets when dealing with observables, so instead of

root.selectedSeat.name c $ c>

root.selectedSeat.name you need to use

root.selectedSeat（）。name

我做了一些快速更改，所以你可以看到我的内容我在谈论。



http://jsfiddle.net/j74pqqat/ 26 / [ ^ ]



您可能还想关注浏览器输出控制台（按Chrome和IE中的F12），它会显示任何javascript错误。另请查看knockoutjs.com上的文档和示例，选项绑定页面此处 [ ^ ]可以帮助您解决此问题。

root.selectedSeat().name
I've made some quick changes so you can see what I'm talking about.

http://jsfiddle.net/j74pqqat/26/[^]

You may also want to keep an eye on your browsers output console (press F12 in chrome and IE) which will show you any javascript errors. And also check the documentation and examples on knockoutjs.com, the page on options bindings here[^] may help you out in this instance.

这篇关于[KnockoutJS] TextBox&amp; ListBox未正确更新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！