Question

I have a project I’m working on in webforms and I’ve run into a hitch trying to assign a value to a hidden form field and then accessing it from the code behind; which is resulting in a null value. I usually work on MVC applications, so I’m a bit confused.

This is the JQuery:

$('.button-submit').click(function () {
    var foo = 'bar';
    $('#hiddenField').val(foo);
});

This is my form:

<form id="form1" runat="server">

    <input type="hidden" id="hiddenField" value="" />

    <asp:Button ID="ButtonSubmit" runat="server" OnClick="ButtonSubmit_Click" Text="Add New"  class="button-submit" />

</form>

And this is in the code behind:

protected void ButtonSubmit_Click(object sender, EventArgs e)
{
    string hiddenFormValue = Request.Form["hiddenField"];
}

Request.Form["hiddenField"] is null. I also tried Request.Params and got a null. Any ideas on how I can either fix this code or recommended a better way to implement? I also tried to use an asp:HiddenField control, which was getting the assigned value (tested with alert($('#hiddenField').val()); but still ending up as an empty string in the code behind.

Answer 1

If you used asp:HiddenField control, js should be like this:

$('.button-submit').click(function () {
    var foo = 'bar';
    $('#<%=controlID.ClientID%>').val(foo);
});