Knockout JS: evento de cambio que no se activa para la fecha HTML5 en el iPad

Question

Estoy utilizando la biblioteca Knockout JS para vincular los controles de entrada HTML5 en mi aplicación web que se ejecuta en el iPad (iOS5, Safari 5.1). El enlace funciona bien para los tipos de entrada como texto y seleccionar pero no para fecha. Después de seleccionar un valor de fecha a través del selector de fecha, el valor no se vincula a la propiedad viewModel (de hecho, no se guarda).

Así es como se ve mi código HTML.

<input id="dob" name="dob" type="date" data-bind="value: dob" /> 

He intentado trabajar con un enlace personalizado donde he inicializado un controlador de eventos de cambio.

ko.bindingHandlers.datePicker = { 
    init: function (element, valueAccessor) { 
     ko.utils.registerEventHandler(element, "change", function() { 
      var observable = valueAccessor(); 
      observable($(element).val()); 
     }); 
    }, 
    update: function (element, valueAccessor) { 
     var value = ko.utils.unwrapObservable(valueAccessor()); 
     $(element).val(value); 
    } 
}; 

Cambiar el código HTML para -

<input id="dob" name="dob" type="date" data-bind="datePicker: dob" /> 

Extrañamente, incluso ese evento no se está disparando. Tenga en cuenta que en ambos escenarios, la vinculación ocurre perfectamente en Windows XP en los navegadores Opera y Safari.

En última instancia, obtuve la solución a mi problema utilizando el evento 'desenfoque' en lugar de 'cambiar' en el enlace personalizado. Ahora se llama al controlador de eventos y estoy configurando manualmente el valor desde el control de fecha.

Ahora mi pregunta es, ¿es algo que no estoy haciendo correctamente? Si no, ¿por qué el evento de cambio del control de fecha de HTML5 no se activa, ya sea de forma predeterminada o mediante un enlace personalizado? Quiero que el control de fecha funcione como se supone que debe hacerlo.

Answer 1

No está haciendo nada incorrecto desde una perspectiva Knockout. Esos eventos realmente no son disparados (sin Knockout ni siquiera en la imagen) por lo que puedo ver probando e investigando un poco.

Usted puede evitar una unión personalizada haciendo:

<input type="date" data-bind="value: myDate, valueUpdate: 'blur'" />

Answer 2

tuve problema similar, pero en mi caso, incluso el caso de la falta de definición es en realidad no efectuado. Así que utilicé input event con la propiedad valueUpdate y resolví el problema.