Question

I have a aspx page (default.aspx), inside which I am loading a user control (tree.ascx).

inside the tree.ascx there is a hidden field.

<asp:HiddenField ID="HiddenField1" runat="server"/>

I am assigning a value to the hidden field using javascript.

document.getElementById('<%=HiddenField1.ClientID%>').value = "some text here";
alert(document.getElementById('<%=HiddenField1.ClientID%>').value);
document.getElementById('form1').submit(); 

The alert displays the value absolutely fine. which means the value gets inserted in the hidden field properly.

But when I am posting back to server and checking the value, it is always null.

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            // do something.
        }
        else
        {                
            string str = this.HiddenField1.Value;              
        }
    }

My code is always getting a empty string here. somehow the postback is erasing the value from the hidden field.

What could be the reason?

Answer 1

Try using below syntax. It works for me even after postback.

ASPX code

<asp:HiddenField runat="server" ID="aspHiddenField" />
<input type="hidden" id="inputHidden" value='<%= aspHiddenField.ClientID %>' />

JavaScript Code

var inputHidden = document.getElementById('inputHidden');
$("#" + inputHidden.value).val("some text");

Code Behind

if (!string.IsNullOrEmpty(aspHiddenField.Value))
 {
//Your code goes here
}