14

We are introducing JQuery to an existing ASP.NET application and use the Validate plugin for JQuery to do the client side validation (we do not want to use the asp.net validators).

Everything works nicely with the asp:Button control. The client side validation is triggered before the page is submitted.

However when using the LinkButton and ImageButton controls the page gets submitted without validating the form first.

This is due to the fact that validate works with Buttons that are rendered as Input type="submit" while the ImageButton renders as Input type="image".

Anyone else experienced this?

Thanks a lot for ideas and infos how to resolve.

Update:

Thanks a lot, your answers helped to identify the problem. it turns out that there was a bug in the validate plugin for JQuery. We used a patch to avoid the validation of hidden input fields, which uses parents().filter(":hidden"). This doesn't work properly in JQuery 1.3.2. We replaced it with .is(":visible"). Now the asp.net ImageButton works by default!

Update2:

The LinkButton still did not work. The simple solution is to add a click function that returns false if the form is not valid:

$("#<%= tb.ClientID %>").click(function() {
            return $('form').valid();
        })
PeterFromCologne
  • 10,213
  • 9
  • 36
  • 46
  • It appears that this is now fixed with the latest release (as of AFAIK 1.5.2). At least ImageButtons work with the validation plugin as is. – Ted Apr 16 '09 at 21:48
  • +1 Thank you very much. I'm trying to do this since yesterday. 1 day got wasted and this I found now. – IsmailS Jul 27 '10 at 05:11
  • As an aside, I use class names to avoid the .net client id issue. This also let your script work on any page, using the class name on the link button. – goodeye Apr 20 '14 at 00:33
  • The update 2 should be marked as answer! This is exactly what I needed thank you! – Crushermike Jan 19 '16 at 18:05

2 Answers2

3

The first suggestion might still work because you can cause the postback to fire using Javascript after the validation occurs.

The javascript is:

__doPostBack('<%= YourImageControl.UniqueID %>','');

The second empty parameter can be used to pass arguments.

iZ.
  • 4,951
  • 5
  • 23
  • 16
0

Not sure if this will help, but give it a shot...

http://docs.jquery.com/Plugins/Validation/validate#options

$("input[type=image]").click(function() {
   $($(this).parents(form)).validate();
});

You might need to replace the "form" with something more specific, but I tried to get it as accurate as possible without knowing how everything's laid out on your page. Reply if this helps!

  • Thanks for the Answer! It won't fly cause the OnClick function that we add with JQuery will replace the onclick that ASP.NET has rendered. The form won't postback with the Options that ASP.NET requires to connect the postback to the ImageButton click Event on the Server Side. But its a start :-) – PeterFromCologne Mar 16 '09 at 22:15