I have implemented this jQuery Slider on my Advanced Search form.
Currently, I have arbitrary min and max values.
How would I set the min value as the minimum value of my database, and vice versa for the max?
var slider = {
$: jQuery,
initSpace: function (el) {
slider.el = slider.$(el);
slider.el.children().hide();
slider.el.append('<span class="search-min">Start</span>' +
' to <span class="search-max">End</span>' +
'<br><div class="slider"></div>').width('400px');
},
initSlider: function () {
var params = {
range: true,
min: 11, //--------------arbitrary
max: 240, //---------------arbitrary
values: [11, 240],
slide: function (event, ui) {
slider.el.find('.search-min').html(Math.floor(ui.values[0] / 12) + '\' ' + (ui.values[0] - (12 * Math.floor(ui.values[0] / 12))) + '"');
slider.el.find('.search-max').html(Math.floor(ui.values[1] / 12) + '\' ' + (ui.values[1] - (12 * Math.floor(ui.values[1] / 12))) + '"');
slider.$(slider.el.children('input')[0]).val(ui.values[0]);
slider.$(slider.el.children('input')[1]).val(ui.values[1]);
}
};
slider.$('.slider').slider(params);
}
};
Best Answer
You can get the minimum an maximum price like this:
I recommend that instead of minimum price to use 0 (zero). Looks nicer for the customers. And for the max value do not use the one you get from your database (something like 455.95). Round it up to a multiple of 10 at least (so it could be 460.00 instead of 455.95). Again for marketing purposes.