0

I know you can do the following in jquery ui slider

$( ".selector" ).slider( "option", "min", 26 );

But it appears the same does not work in easyui.

Ok. I wanted to change the min/max options of a slider when user enters a new value for the min/max, but in the documentation of easyui, its method 'option' only gets options and can not set.

Okay Here is what I've tried based on isherwood's idea:

<head>
<link href="easyui/themes/default/slider.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="easyui/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" >
$(document).ready(function(){
$("#myslider").slider({
    width: 300,
    mode: 'h',
    showTip: true,
    value: 5,
    min: 0,
    max: 10,
});
$("#min")[0].addEventListener("input", function(){
var v = $("#min").val();
if (v <= 5 ) {  
    $("#myslider").slider('destroy').slider({  
        width: 300,
        mode: 'h',
        showTip: true,
        value: 5,
        min: v,  
        max: 10
    });
}
else {
     alert("out of bound(1-5): " + v);
}
}, false);
});</script> 
</head>
<body>
<input type="text" id="min" value="0"></input> <br /><br /><br />
<div id="myslider"></div>
</body>
</html>

Update: The question was answered in easyui forum by stworthy . It should be something like slider({min, 20}). Duh!

McVenco
  • 1,011
  • 1
  • 17
  • 30
KudoofTheQ
  • 21
  • 5

1 Answers1

0

To change the options of a slider you'd need to destroy and recreate it.

http://www.jeasyui.com/documentation/index.php

$('#mySlider').slider('destroy').end().slider({  
    min: 1,  
    max: 2
});
isherwood
  • 58,414
  • 16
  • 114
  • 157