ansaurus

Question

Answer 1

A:

I think you've misunderstood the purpose of the jQuery click handler in this context, and you're not returning false in the onClientClicked event.

There is no reason to use the onClientClicked property to wire up a jQuery click handler for a server side button or image. Just wire up a script call in there to whatever script you need to execute.

Like this:

<asp:Button ID="Button2" runat="server" Text="Trigger" onClientClick="doClientSideCheck();" />

<script type="text/javascript">
  function doClientSideCheck()
  {
    return false;
  }
</script>

On the other hand when you have client side button or image this is where the jQuery click handler is appropriate.

<input id="button1" type="button" class="myButtonClass" value="Submit" />

    <script type="text/javascript">
     $(document).ready(function()
        {
             $(".myButtonClass").click(function(e) { alert('button clicked ' + $(this).attr('id') ); });
         });
    </script>

James 2010-03-15 20:47:33

Button2 is not a button in my application, rather an image. Poor example I guess. Button2 is actually an image with the onclick pointing to Button1.

rpiontek 2010-03-15 20:53:11

@rpiontek - please re-read my revised post.

James 2010-03-15 21:01:45

I thought the purpose of the .click() event in jQuery was to perform a similar action as if the user clicked manually. I did not want to have the Javascript written explicitly for each function.I do realize that OnClientClick wires to onclick because that's how I wired it in my control. The idea was to trigger the hidden button directly, and use its defined onclick to perform the necessary action.

rpiontek 2010-03-15 21:51:51

What you're trying to do is a hack, and is sure to have issues with different browsers. Why not just use an asp:ImageButton and set the onClientClick to some client side JS that get's called? You can attach jQuery behaviors to it to handle the rollover state change if you want. The main idea is to make sure the click action is handled by one framework not two.

James 2010-03-15 22:23:34

I hadn't considered using one control to fire a click to another control a hack, rather another way to accomplish a problem.As I stated, I originally used an invisible imagebutton (using a transparent gif as the background) with the same size as the images underneath. I was not particularly satisfied with this approach as it is also a "hack" in that I am merely using the button for it's ability to be reflected to another function.I am keen to know why jQuery.click() does not behave similarly to a user click, which was my original question.

rpiontek 2010-03-15 22:52:08

In general jQuery.click() does behave like a normal user click. Where you start getting into trouble is when the element has non-jQuery script bound to onClick i.e. asp.net postback handler. I havn't spent the time to investigate why this is, I suspect it has something to do with the ordering of how the MS and jQuery script ends up on that event and it seems to have different results browser by browser. In some cases it works, but it's hardly a solution!

James 2010-03-15 23:33:12

James...I really appreciate your help. I think I will have to go back to using the Invisible button. Now if I could only find a way around needing a transparent pixel gif to fill it with.

rpiontek 2010-03-16 02:50:56

Answer 2

A:

Placed code in first post

rpiontek 2010-03-15 20:47:34

Answer 3

A:

The runat="server" indicates that a postback is required. If you're not getting it for Button1, it's probably because you have an OnClick and an OnClientClick in the same tag and the combination is overriding the runat attribute.

Jekke 2010-03-15 20:50:45

Not sure I follow your line of reasoning. It works fine when I click the button directly. Why would this change through jquery trigger?

rpiontek 2010-03-15 20:57:14

Answer 4

A:

jQuery's click method doesn't return true or false like the OnClick method does - it instead returns a reference to itself. This is to facilitate chaining of jQuery method calls.

Ideally what you want is to call the same method from both Button1 and Button2's javascript instead of just having one button call the other. If you need some condition where a postback IS required, you can stick a call to Button1.GetPostbackEventReference in there.

jQuery also makes this really easy if you use a CSS class to handle it:

<asp:Button ID="Button1" CssClass="ButtonHandler" />
<asp:Image ID="Button2" CssClass="ButtonHandler" />

<script>
$(document).ready(function() {
    $(".ButtonHandler").click( function() {
        // stuff you want to do
        return false;
    });
});
</script>

This may not be exactly what you need, but I think you need to go into a bit more detail into what exactly you want.

MisterZimbu 2010-03-15 21:02:15

This may have issues working with the MS server post back model.

James 2010-03-15 21:03:54

I do have jQuery code already binding to the button to enable a fade effect for the images, however the button submit behavior still needs to be wired up.

rpiontek 2010-03-15 22:53:49

ansaurus

tags:

views:

answers:

click() not behaving like user click

related questions