Jquery UI Range Slider with associated Text Input Events (Failing)?

For multi-handle sliders, you need to use 'values' rather than 'value' (which you're doing) but 'values' takes this format: . Slider( "values" , index , value ) You probably want to enforce max >= min when setting the slider values based on the textboxes. You are passing the initial values to .slider() incorrectly, I don't know where that {{...}} nonsense came from (is that a jQuery template?).

It's generally not a great idea to use underscores in class names. Use - instead of _. The fixes: var $slider = $('.

Price-slider'), $lower = $('#lower_bound'), $upper = $('#upper_bound'), min_rent = 1000, max_rent = 9000; $lower. Val(min_rent); $upper. Val(max_rent); $('.

Price-slider'). Slider({ orientation: 'horizontal', range: true, animate: 200, min: 0, max: 10000, step: 100, value: 0, values: min_rent, max_rent, slide: function(event,ui) { $lower. Val(ui.

Values0); $upper. Val(ui. Values1); } }); $lower.

Change(function () { var low = $lower.val(), high = $upper.val(); low = Math. Min(low, high); $lower. Val(low); $slider.

Slider('values', 0, low); }); $upper. Change(function () { var low = $lower.val(), high = $upper.val(); high = Math. Max(low, high); $upper.

Val(high); $slider. Slider('values', 1, high); }); Demo: http://jsfiddle.net/mattball/pLP2e.

This was a great answer on a number of levels. It worked but have a couple of interesting comments. First, parseInt was not necessary.

Second, the {{ brackets are Django template variables. I set the range values based on the user's previous search. Finally, I created an extra conditional within the text input event handlers.

If $lower.val()> $upper.val() --> $upper. Val($lower.val()). Otherwise, the sliders were overlapping in the wrong direction and funky behavior was resulting – Brendan May 9 at 15:34 I changed the text input handler logic, did you see the latest version?

– MДΓΓ БДLL May 9 at 15:38 I saw the changes just now. I see how yours works but mine (see edit above) seems to require less code. Generally curious why one would be preferably over the other.

– Brendan May 9 at 15:45 Also, useful link re: underscores in CSS. I wish I read that before I created a whole website full of class and ID underscores – Brendan May 9 at 15:45.

According to the jQuery UI documentation, slider('values') takes index as the second param and value as the third. Try this: $('input#lower_bound'). Change(function(){ $('.

Price_slider'). Slider("values",0,$(this).val()); $('. Price_slider').

Slider("values",1,$('input#upper_bound').val()); }); $('input#upper_bound'). Change(function(){ $('. Price_slider').

Slider("values",0,$('input#lower_bound').val()); $('. Price_slider'). Slider("values",1,$(this).val()); }).

Thanks Darth. I think that Matt beat you to the punch by a hair. But this was good info regardless – Brendan May 9 at 15:35 Yes he did, just as I was about to click the submit button, but since I typed it already I though I'd post it anyway.

:) – DarthJDG May 9 at 15:43.

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.

Related Questions