Can not Use the Value of Hidden Fields to Set Progressbar Options

Can not Use the Value of Hidden Fields to Set Progressbar Options

Hey guys

First of all, I'm a ASP.NET web developer, and I'm quite new to JQuery.

I have a simple Progressbar; I set only its value and max options. I use no methods or events of Progressbar.

There is a <div> element on page that is used for the Progressbar:
  1. <div id="divHealth"></div>

And This is the code that creates the Progressbar:
  1. $(document).ready(function () {
  2.       $("#divHealth").progressbar({
  3.             max: 100,
  4.             value: 60
  5.             });
  6. });

This code works fine and makes no problems, but I don't wanna harcode the Progressbar options; I wanna use hidden fields to set its options.

Here is the hidden field I have on the page:
  1. <input type="hidden" id="hdnHealth" runat="server" value="" />
The value of this hidden field is assigned on code-behind. For this example, I assign 50 to it.

Here is the revised code that sets the value of the Progressbar using the value of the hidden field:
  1. $("#divHealth").progressbar({
  2.       max: 100,
  3.       value: $("#<%=hdnHealth.ClientID %>").attr("value")
  4. });
But this code does not work properly. It seems it can't assign the value of the hidden field to the Progressbar although the value of the hidden field is accessible. I added a line of code to assign the value of the hidden field to a variable, then used Firebug to monitor the process. The value of the variable was 50 (equal to the hidden field), but when I tried to assign the variable to the "value" option of the Progressbar, again nothing happened.

Everything works fine; the Progressbar is created exactly the way I want, but when I try to use the hidden field for the value option of the Progressbar, it crashes. It seems no value has been set for the value option.


You guys know how to fix it?