Changing hidden field value with jquery and getting new value on server
I am changing the value from a hidden field using jquery and now I want to get the new value on the server. I am using asp.net and this is my jquery code:
$('#HiddenField').val("NewValue");
and this is my html tag:
<input id="HiddenField" type="hidden" runat="server" value=""/>
on my page i change the value '#HiddenField'
and i want to get the NewValue server side.
+3
source to share
2 answers
I tried with this on my page,
<!DOCTYPE html>
<html>
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button runat="server" ID="goBtn" Text="Go" OnClick="goBtn_Click" />
<input id="HiddenField" type="hidden" runat="server" value="" />
<asp:TextBox runat="server" ID="testTxt"></asp:TextBox>
</div>
</form>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#<%=HiddenField.ClientID %>').val("Test");
});
</script>
</body>
</html>
and this is in the code behind,
protected void goBtn_Click(object sender, EventArgs e)
{
testTxt.Text = HiddenField.Value;
}
when you hit the go button, the new value is available on the server.
+8
source to share
You need to use the ClientID of your hidden field in your JQuery selector like:
$('#<%= HiddenField.ClientID %>').val("NewValue");
Or alternatively, style the hidden field and access it with a class like:
<input id="HiddenField" type="hidden" runat="server" value="" CssClass="hidden"/>
$('.hidden').val("NewValue");
+7
source to share