Note that there are some explanatory texts on larger screens.

plurals
  1. POJquery color picker binding handler creates multiple divs
    primarykey
    data
    text
    <p>I am trying to use this jquery <a href="http://laktek.com/2008/10/27/really-simple-color-picker-in-jquery/" rel="nofollow noreferrer">color picker</a> with knockout.js. I have written custom banding handler to bind colorpicker input control with my viewModel color value. </p> <p>Here is the Binding Handler code:</p> <pre><code>ko.bindingHandlers.colorPicker = { init: function (element, valueAccessor, allBindingsAccessor) { //initialize datepicker with some optional options var options = allBindingsAccessor().colorPickerOptions || {}; $(element).colorPicker(options); //handle the field changing ko.utils.registerEventHandler(element, "change", function () { var observable = valueAccessor(); observable($(element).colorPicker("value")); }); //handle disposal (if KO removes by the template binding) ko.utils.domNodeDisposal.addDisposeCallback(element, function () { $(element).colorPicker("destroy"); }); }, update: function (element, valueAccessor) { var value = ko.utils.unwrapObservable(valueAccessor()); $(element).colorPicker("value", value); } </code></pre> <p>and HTML :</p> <pre><code> &lt;input type="text" data-bind="colorPicker: newEvent().color, colorPickerOptions: { value:newEvent().color }"/&gt; </code></pre> <p>Problem is that when I change the color it creates the multiple divs each time when I change the color as shown in image. </p> <p><img src="https://i.stack.imgur.com/WjsiC.png" alt="enter image description here"></p> <p>Can anyone please identiy whats the problem in my code??</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

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