Kapil Kapil - 6 months ago 12
Javascript Question

cannot call methods on slider prior to initialization attempt to call method 'value'

I am using the following code for slider

Css and Jquery:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>


ASPX:

<p>
<label for="amount">Value:</label>
<input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />%
</p>
<div id="slider-vertical" style="height: 15px; width:800px"></div>
<script type="text/javascript">
$(function () {
$("#slider-vertical").slider({
orientation: "horizantal", range: "min", min: 0, max: 100, value: 60,
slide: function (event, ui)
{ $("#amount").val(ui.value); }
});
$("#amount").val($("#slider-vertical").slider("value"));
});
</script>


I am trying to set the value for slider:

function UpdateSlider(PhaseInStatusReportVal) {
$("#slider-vertical").slider("value").val(PhaseInStatusReportVal);
}


I am calling above code from something like this :

ClientScript.RegisterStartupScript(Me.GetType(), "updatetheslider", "UpdateSlider('" + BCOMSPackageValidationList(0).PhaseInStatusReport.ToString() + "')", True)


but it's throwing the above error.

Can anyone please help me?

Answer

Have you considered a different approach. Setup a hidden field with the initial value -> populate the value from the code-behind, then do something like:

$(function () {
    $("#slider-vertical").slider({
        value: $("#hiddenFieldWhatever").val(),
        // setup the rest ...
    });  
});

I hope I understood your requirements correct.

Comments