2012-05-08 28 views
6

Estoy usando Knockout.js y ASP.NET. Mi HTML es el siguiente:Knockout.js valueUpdate no funciona cuando el usuario usa el teclado

<div class="InputField"> 
    Fixed/Floating 
    <div class="FieldContainer"> 
     <select data-bind="options: $root.FixedLoanOptions, selectedOptions: IsFixed, valueUpdate: 'change'" ></select> 
    </div> 
</div> 

Si el usuario utiliza el ratón para seleccionar el elemento, el JSON regresa al servidor con la información actualizada. Pero si el usuario utiliza "tab" para tabular en el control de selección, seleccione un elemento y tab off, luego, aunque el elemento seleccionado se muestre en la interfaz de usuario, el JSON regresa con un valor en blanco para este control.

Parece que el modelo de vista Knockout no se actualiza si el usuario usa el teclado solamente, parece haber algún evento de cambio que ocurre específicamente en el navegador cuando el usuario usa el mouse.

¿Cómo puedo solucionar esto? ¿Hay alguna manera de registrar los cuadros de selección en el evento de cambio para usar una función que actualice manualmente el modelo Knockout?

Lo he probado en IE9 y Firefox y tengo el mismo problema en ambos.

Respuesta

0

Puede cambiar el evento cuando knockoutjs actualice el modelo para desenfocar el que se dispare más.

<div class="InputField"> 
    Fixed/Floating 
    <div class="FieldContainer"> 
     <select data-bind="valueUpdate: 'blur', options: $root.FixedLoanOptions, selectedOptions: IsFixed" ></select> 
    </div> 
</div> 
+0

Lo sentimos, que no resuelve el problema. Los datos del modelo solo cambian cuando hago clic en los controles, no cuando uso el teclado. – 333Mhz

0

Como se puede ver en Live example Knockout modelo de actualización sólo cuando se selecciona seleccione la opción:

  • Clic con el mouse
  • Presionado el botón enter después de seleccionar con los botones de flecha del teclado.
0

Enlazando el valorActualizar a 'keyup' me fue el truco. No afecta los cambios realizados con el mouse, por lo que se ve bien hasta ahora.

Así que algo como esto debería funcionar:

<div class="InputField"> 
    Fixed/Floating 
    <div class="FieldContainer"> 
     <select data-bind="valueUpdate: 'keyup', options: $root.FixedLoanOptions, selectedOptions: IsFixed" ></select> 
    </div> 
</div> 
Cuestiones relacionadas