2015-04-29 3 views
2

У меня есть форма, которая использует knockout.js, где использование может вводить значения, а затем нажать кнопку или нажать клавишу ввода, чтобы применить значения к текущей виртуальной машине.прочитайте недействительный ввод в Knockout.js введите обработчик

Все работает нормально, когда я нажимаю кнопку или выпадаю из поля ввода, прежде чем нажимать кнопку ввода, но если я нажму на ввод без табуляции поля ввода, я прочитаю устаревшее значение (или нет значения, если поле имеет еще не потерял фокус).

 self.triggerApplyInputByEnter = function (data, event) { 
      if (event.keyCode === 13) { 
       self.ApplyInput(); 
       return false; 
      } 
      return true; 
     }  

Markup:

    <table> 
        <tbody data-bind="foreach: Inputs"> 
        <tr> 
         <td><input type="text" placeholder="Start" data-bind="value: InputStart, event: { keypress: $parent.triggerApplyInputByEnter }" /></td> 
         <td><input type="text" placeholder="End" data-bind="value: InputEnd, event: { keypress: $parent.triggerApplyInputByEnter }" /></td> 
        </tr> 
        </tbody> 
       </table> 
       </td> 
      <td> 
       <a href="#" title="" data-bind="click: ApplyInput" ><span>Apply Input</span></a> 
      </td> 

Моя интуиция, что мои наблюдаемыми, которые связаны с моими полями ввода не обновляются, пока поле ввода не теряет фокус. Любые указания о том, как читать незафиксированное значение в обработчике нажатия клавиши или принудительно вводить поля ввода для привязки данных, когда я нажимаю Enter или каким-либо другим способом читать последние значения, когда я нажимаю Enter?

Обновление: Я обнаружил, что использование «valueUpdate: 'afterkeydown» работает в том, что он обновляет наблюдаемые с каждым нажатием клавиши, что кажется неэффективным, если вводится большое количество данных, но для моего случая это достаточно хорошо.

<td><input type="text" placeholder="Start" data-bind="value: InputStart, valueUpdate:'afterkeydown', event: { keypress: $parent.triggerApplyInputByEnter }" /></td> 
+0

Я не уверен на 100%, что это решит вашу проблему, но вы посмотрели ссылку [hasFocus] (http://knockoutjs.com/documentation/hasfocus-binding.html)? Я никогда не сталкивался с вашей проблемой, но мы могли бы начать работу там, если вы не хотите сделать [JSFiddle] (http://jsfiddle.net/). –

ответ

2

textInput связывание был разработан в режиме реального времени обновления кросс-браузер. Это будет служить вашему прецеденту.

valueUpdate: 'afterkeydown'" привязка может завершиться неудачей в ряде сценариев, таких как мобильные.

+0

отлично работает, спасибо – Stanley

Смежные вопросы