Passing value from code-behind to Javascript

Question

I am using a jQueryUI ProgressBar to show users how much allowed file storage they have used. The percentage is calculated in code-behind and should be passed to Javascript.

Answer 1

Try this

var pct = document.getElementById("<%=filesPercentage.ClientID %>").value;

Answer 2

.net will modify the id you give a control to ensure it is unique, so you are not accessing it with the correct id. If you give the hidden field a unique class name, you can access the value that way:

<input type="hidden" runat="server" id="filesPercentage" class="hiddenClass" /> 
var pct = $('.hiddenClass').val();

Answer 3

since your hidden field is a server control it could be that the ID is getting generated to something other than filesPercentage (probably something like ctl00_ctl00_filesPercentage)

• You may need to apply the generated client ID to your javascript document.getElementById("<%=filesPercentage.ClientID%>").value;
• Or use another way of selecting the hidden value, such as $('[hidden's parent element] input[type="hidden"]').val()

---

additionally, it looks like progressbar value is expecting a number, so you may need to do value: pct * 1 or value: parseInt(pct)

http://jsfiddle.net/pxfunc/QyZSs/

Answer 4

You need to get the rendered id of your hidden input

var pct = document.getElementById("<%=filesPercentage.ClientID%>").value;

and from the moment that you run the input on server its better to use the asp:HiddenField and not the input

Answer 5

This is a bit cleaner IMHO :-)

$("#progressbar").progressbar({
  value: $("#<%=filesPercentage.ClientID%>").val()
});