jQuery datepicker not updating knockout bindings in IE 7, IE 8, IE 9

Recently we had an issue whereby our datepickers were not updating the corresponding view-model observables correctly. The first time a user tried to select a date or manually type one, focussing away would clear out the value. I made a minimal reproduction that was essentially:

with the html:

We were naively using the default “value” knockout binding to update the observable, but this turned out to be inadequate. In earlier versions of IE we were experiencing strange behaviour – when the value of the field was changed through user interaction the observable’s was updated with the previous value. This meant it was constantly a value behind.

The solution is to create a custom binding handler that interacts with the jQuery widget’s api directly ala this post by the powerhouse RP Niemeyer. I’m posting the symptoms of the problem here in case anyone experiences this issue in the future and doesn’t know the reason behind it.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s