Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

KnockoutJS: How to update view model after a user copy'n'paste into a text field?

Tags:

I am working on a website that auto populates search result in a table after user entered some text in the input text box (similar to google instant search).

I managed to get knockout js to update view model as user enters information by adding

valueUpdate: 'afterkeydown'

into my data-bind attribute, however, I also need to handle the case where user right click and paste some text into the textbox so I tried:

valueUpdate: ['afterkeydown','mouseup']

but that didn't work and when I tried to read the value of the text box through the view model I kept getting the old value until I tab out of the input text box.

Anyone know how can I fix this?

Oscar

like image 575
oscarkuo Avatar asked Jun 19 '12 20:06

oscarkuo


1 Answers

You can use valueUpdate:'input'. I have testet it to work in Opera, Firefox and Chrome. I'm on a Linux box, so I can't test it in IE. Check this fiddle

UPDATE: I have now testet it in IE8, and it doesn't work. But using the following seems to work.

valueUpdate:['afterkeydown','propertychange','input'] 

Thanks to Michael Best for his comment about this :) I have updated the fiddle

UPDATE okt 2014: As kzh mention in a comment below, in one of the later versions of Knockout.js the textInput binding was added. This binding handles this scenario and has build in browser quirks handling http://knockoutjs.com/documentation/textinput-binding.html

like image 60
aaberg Avatar answered Sep 29 '22 19:09

aaberg