Saturday, 15 August 2015

Jquery Slider UL - multiple filters -



Jquery Slider UL - multiple filters -

i seek create advanced search engine based on jquery slider.

fiddle

$(document).ready(function() { $("#slider_powcalk").slider({ range:true, min: 0, max: 1000, step: 5, values: [100, 900], slide: function(event, ui) { (var = 0; < ui.values.length; ++i) { $("input.slider_powcalk_value[data-index=" + + "]").val(ui.values[i]); } } }); $("input.slider_powcalk_value").change(function() { var $this = $(this); $("#slider_powcalk").slider("values", $this.data("index"), $this.val()); }); });

i want run multiple sliders on single page , each width 2 values (inputs) how can run sec slider maintain clear code (i dont wnat re-create code , alter class only)

thanks help

note illustration duplicates ids (which must unique), doesn't cause issues code.

to want, try:

$(document).ready(function () { $("#slider_powcalk, #slider_sso").each(function () { var value = parseint($(this).text(), 10); $(this).empty().slider({ range: true, min: 0, max: 1000, step: 5, values: [100, 900], slide: function (event, ui) { (var = 0; < ui.values.length; ++i) { $(this).parent().find("input[data-index=" + + "]").val(ui.values[i]); } } }); }); $("input.slider_powcalk_value").change(function () { var $this = $(this); $("#slider_powcalk").slider("values", $this.data("index"), $this.val()); }); });

jsfiddle example

i added #slider_sso slider instantiation $("#slider_powcalk, #slider_sso").slider({ , updated value in slide event $(this).parent().find("input[data-index=" + + "]").

jquery slider

No comments:

Post a Comment