How to trigger Asp:HiddenField OnValueChanged event using JQuery?

I have this asp:hiddenField control:

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

I would like to trigger its (server side) value changed event using Jquery:

Protected Sub AuxHiddenField_Changed(ByVal sender As Object, ByVal e As System.EventArgs) Handles AuxHiddenField.ValueChanged
    'some logic here      
End Sub

I tried:

$('#AuxHiddenField').val("Mohaha!!");   

Jquery fails to find the element and nothing happens. How do I solve this?

Answers


ASP.net uses an algorithm to generate ClientID. By default it is based on the naming container's the control is contained in successively.

It's likely the ID in generated HTML is not AuxHiddenField but something like ctl00_AuxHiddenField.

Either set the ClientIDMode:

<asp:HiddenField ID="AuxHiddenField" runat="server" CLientIDMode="Static" />

Or in jquery, using attirute selectors:

$('input[id$=AuxHiddenField]')  // id ends with AuxHiddenField

I personnaly don't like the <%= Field.ClientID %> way of doing this because if your javascript is in a separate file, it won't be processed by asp.net.

Further reading:


Changing programmatically a value with javascript does not fire the change event, you have to trigger it manually:

$('input[id$=AuxHiddenField]').val("any val").change(); // or .trigger('change');

In action here.


About the ValueChanged event

Unfortunately, the HiddenField does not have the AutoPostBack property (makes sense afterall). I think you will have to trigger a postback programmatically after changing the value. If you are working ajax, use __doPostBack(), otherwise, submit your form document.forms[0].submit().

Another solution would be to replace the HiddenField by an invisible TextBox:

<asp:TextBox runat="server" ID="mytextbox" Value="" Style="display:none;" AutoPostBack="true" OnTextChanged="mytextbox_TextChanged"></asp:TextBox>

Changing the value programmatically will raise the event server-side. Please note that for hiding the textbox, you should not use Visible="false because then it is not rendered in final html, use the Style="display:none;" property (css).


Need Your Help

Select all c file in a directory on a Makefile

compiler-construction makefile make

i've got a Makefile and i want to modify it, to select all c files in some directory instead of specify all c file separately.

Handling wcf Rest web service using KissXML - how should I handle namespace issue

objective-c wcf rest kissxml

I'm using KissXML on iOS to parse the XML data returned from a wcf REST web service (written in c#)