knockoutjs select change event gets fired when binding

knockout.js knockout-2.0
Nick Developer picture Nick Developer · Jun 17, 2013 · Viewed 12.2k times · Source

I have this knockout code: http://jsfiddle.net/nickbuus/Rwabt/

The problem is that whenever the dropdown select box gets filled the change event gets called:

 <select data-bind="options: $root.Categories, optionsText: 'categoryName', optionsValue:       'categoryId', value: CatId, optionsCaption: 'Vælg...', event: { change: $root.selectionChanged }"></select>

How do I fix this ?

Answer

Anders picture Anders · Jun 17, 2013

There was a lot of broken and unused code in there

http://jsfiddle.net/Rwabt/5/

This one is corrected. What actually did make it call change is for two reasons, you used string in the food model and numbers in category model ("1" != 1), Id 2 was not present in the categories (Only 1) the beer category was set for both food items (CatId 2). Since KO could not find these in the options list it reseted the selected value to null.

That said please have a look at my fiddle to see a more KO way of doing things

Related questions

How to Clear Contents of an observableArray That was Populated from Previous Visits to a View

I have a Single Page Application that uses knockout for the data binding. The CAApproval.html view in my single page application has an observeablearray named AllCertificates in the viewmodel code. It populates fine on the page. When you navigate …

Read More
Setting the id attribute with knockoutjs including a prefix

I'm using KnockoutJS to iterate over an object, like this: Now this all works. But the problem i have is that it sets the id of the button to just a number. So it looks like this: <button id="1"&…

Read More
Binding true / false to radio buttons in Knockout JS

In my view model I have a IsMale value that has the value true or false. In my UI I wish to bind it to the following radio buttons: <label>Male <input type="radio" name="IsMale" value="…

Read More