jquery multiselect - binding to knockout issue


Staff member
I am having issues with using <a href="http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/" rel="nofollow">Eric Hynds excellent multiselect widget</a> with Knockout.

My code is <a href="http://jsfiddle.net/3Uqwn/" rel="nofollow">here</a>.

I'm using a custom binding from <a href="http://darkroastjava.wordpress.com/2011/11/17/using-eric-hynds-multiselect-with-knockout/" rel="nofollow">this article</a>.

If you change the option in the first box, the multi-select reverts to the default type instead of using the plugin - I'm guessing I need to modify the binding, but I'm fairly new to Knockout and rapidly getting out of my depth here.

Can anyone suggest any pointers - any articles on how to write custom bindings may be useful to if anyone has any references handy other than this one of course.

OK: I'm a bit closer: See <a href="http://jsfiddle.net/3Uqwn/2/" rel="nofollow">here</a>

Now the only issue is that whenever you change the selection in the first box, you lose any items from the 2nd that are still relevant - also there is some odd behaviour for instance if you:

<li>Select "All Link Health"</li>
<li>Click the multiselect and check the first item</li>
<li>Select "All Watches"</li>
<li>Select "All Link Health" again</li>

then you suddenly have all 5 items checked!