Databases
StackOverflow2013
Postsdbo
POUpdating the model does not update the view
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POUpdating the model does not update the view
    text
    copied!<p>I'm using what I believe to be the generally accepted <code>ko.bindingHandler.select2</code>: </p> <pre><code>ko.bindingHandlers.select2 = { init: function (element, valueAccessor) { $(element).select2(valueAccessor()); ko.utils.domNodeDisposal.addDisposeCallback(element, function () { $(element).select2('destroy'); }); }, update: function (element) { $(element).trigger('change'); } }; </code></pre> <p>However, this seems to have a couple of issues. In this question I'd like to find an answer for how to make the View update when a change to the Model is made.</p> <p>I've created a <a href="http://jsfiddle.net/Mmuvx/1/" rel="nofollow">jsFiddle</a> which demonstrates the issue. I have a simple <code>setTimeout()</code> function that sets the Model's <code>selectedValue</code> after 0.25 seconds to emulate behaviour similar to the Model loading data via an Ajax call. In the example the dropdown value is not updated when Select2 is used but appears to work just fine for a normal dropdown.</p> <p><b>Full Solution : </b> My updated custom binding now looks like this...</p> <pre><code>ko.bindingHandlers.select2 = { init: function (element) { $(element).select2({}); ko.utils.domNodeDisposal.addDisposeCallback(element, function () { $(element).select2('destroy'); }); }, update: function (element, valueAccessor) { var value = valueAccessor(); var valueUnwrapped = ko.utils.unwrapObservable(value); $(element).val(valueUnwrapped).trigger('change'); } </code></pre> <p>};</p> <p>In my HTML I'm now passing in the value to the custom binding.</p> <pre><code>data-bind="select2: selectedValueS2 </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload