Posted 25 Jan 2012 Link to this post
Posted 30 Jan 2012 Link to this post
Dynamic resizing of the slider is currently unsupported. The way to resolve this is to re-initialize the slider, by destroying it first ($("#slider-container").empty()) and initializing it again, with the same configuration. We are looking for a more graceful solution of this problem, but for now, use this approach.
Posted 26 May 2012 Link to this post
$(this.element).closest('p').find('.pickup_date').empty().width(149).kendoDatePicker({ animation: false, format: "MM/dd/yyyy" });
function onChange(e) {
switch (this.value())
{
case "range":
$(this.element).closest('p').children('label').hide();
$(this.element).closest('.section-content').find('.pickup_date_range_addition').show();
break;
default:
$(this.element).closest('p').children('label').show();
$(this.element).closest('.section-content').find('.pickup_date_range_addition').hide();
$(this.element).closest('p').find('.pickup_date').empty().width(185).kendoDatePicker({ animation: false, format: "MM/dd/yyyy" });
}
$(".kdropdown").kendoDropDownList({ animation: false, change: onChange });
Posted 04 Sep 2012 Link to this post
Posted 25 Feb 2013 Link to this post
var
width = $(
'#rangeColumn'
).width();
console.log(
'width = '
+width);
$(
'input[type="range"]'
).empty().width(width+
'px'
).kendoSlider({showButtons:
false
,tickPlacement:
'none'
});
// initialize or resize all sliders
Posted 26 Feb 2013 Link to this post
Yes, input elements are always empty, because they do not have any children. You need to clean the container of the slider element, i.e. some element that contains the slider.
function
resizeRange(element, width, config) {
element = $(element);
slider = element.parent().parent();
parent = slider.parent();
parent.append(element);
slider.remove();
element.width(width).kendoSlider(config);
element.parent().parent().show();
// not sure why its hidden
// calling it
resizeRange(
'#ageRange'
,
'100px'
, {showButtons:
, tickPlacement:
Posted 27 Feb 2013 Link to this post
Posted 18 Sep 2014 Link to this post
$(document).ready(
() {
"#rangeslider"
).kendoRangeSlider();
rangeSlider = $(
).getKendoRangeSlider();
rangeSlider.wrapper.css(
"width"
"400px"
);
rangeSlider.resize();