jQuery clone jQueryUI slider weird behaviour -
on page, when user fills in searchbox, add search result div rows cloned (withdataandevents = true) jquery. of these rows contain form elements , jquery ui slider. events these elements bound data-bind feature of knockoutjs. event handlers on regular form elements work fine, not jquery ui slider. when dragging handles, jumps original row.
some code:
$(divselector).each(function (i, div) { if (arrpropertyguids.indexof($(div).attr("data-propertyguid")) == -1) { $("#propertiessearchpanel").append($(div).clone(true).show()); } }); i loop through divs (rows) , add them 1 one result panel, cloning them (also tried deep cloning no difference). divs hidden in source need call .show().
what did try:
- tried re-initiliaze sliders. no different behaviour detected.
- tried destroy , initialize sliders after cloning, gives error:
cannot call methods on slider prior initialization; attempted call method 'destroy'
$(".range-slider").slider("destroy"); so, seems me in 1 way or another, cloned slider not "real" jquery ui slider, still linked original elements.
anyone has idea on how solve this?
i have 1 working solution, not ideal one. i'm leaving question open in case might have better answer.
i deleted sliders , re-added div tags. after that, reapplied jquery ui slider init functions.
$("#propertiessearchpanel").find(".range-slider").remove(); $("#propertiessearchpanel .range-box").each(function (i, tb) { $(tb).next("label").after('<div class="range-slider"></div>'); } }); sliders($("#propertiessearchpanel")); //init functions sliders
Comments
Post a Comment