Evento de pulsación de tecla de unión en knockoutjs, observable no poblado

Question

Necesito ayuda con knockoutjs y vinculando un evento de pulsación de tecla. Estoy tratando de enganchar el knockout para que tome la tecla Enter desde dentro de un cuadro de texto. Entonces puedo realizar la misma acción que presionar un botón. Es un poco difícil de explicar, pero espero que este JsFiddle demuestre lo que estoy tratando de lograr.

http://jsfiddle.net/nbnML/8/

El problema que tengo es que el valor observable no está siendo actualizado y creo que es algo que ver con un observable no está actualizada hasta que el enfoque se aleja del cuadro de texto?

Cualquier solución a este problema.

Gracias!

Answer 1

Una opción es utilizar el enlace adicional valueUpdate para forzar una actualización de cada pulsación de tecla. Por ejemplo, usted haría:

<input type="text" data-bind="value: InputValue, valueUpdate: 'afterkeydown', event: { keypress: RunSomethingKey }" /> 

Si eso no es lo que está después, entonces realmente que se quiere disparar evento de cambio del elemento en el controlador. Por ejemplo, con jQuery, harías algo como: $(event.target).change();.

Sin embargo, sería mejor mover esto a un enlace personalizado. Tal vez algo como (probablemente debería comprobar si el resultado de valueAccessor() es una función):

ko.bindingHandlers.enterKey = { 
    init: function(element, valueAccessor, allBindings, vm) { 
     ko.utils.registerEventHandler(element, "keyup", function(event) { 
      if (event.keyCode === 13) { 
       ko.utils.triggerEvent(element, "change"); 
       valueAccessor().call(vm, vm); //set "this" to the data and also pass it as first arg, in case function has "this" bound 
      } 

      return true; 
     }); 
    }   
}; 

Aquí se actualiza su muestra: http://jsfiddle.net/rniemeyer/nbnML/9/

Answer 2

No te Descuento sumisión que se ha fijaciones: http://knockoutjs.com/documentation/submit-binding.html

Esto soluciona algunos errores de IE 9/10, como la clave de retorno que no actualiza el observable. Con este cuidado de que no es necesario para interceptar código clave 13

html:

<form data-bind="submit:RunSomething"> 
<input type="text" data-bind="value: InputValue" /> 
<input type="submit" value="test" /> 
<div data-bind="text: InputValue" /> 
</form> 

código:

var ViewModel = function() { 
    var self = this; 
    self.InputValue = ko.observable(''); 

    self.RunSomething = function (ev) { 
     window.alert(self.InputValue()); 
    } 
} 
ko.applyBindings(new ViewModel()); 

Ver esta aquí:

http://jsfiddle.net/jnewcomb/uw2WX/