Prevent LinkButton post back OnClientClick not working. Why?

Question

I know there are plenty of answers surrounding this topic but I just cannot get this to work.

I need to prevent a link button posting back and the following code is not working. The code is definitely being hit in all the required places.

Link button definition:

  <asp:LinkButton ID="NavHelp" OnClientClick="showConfirm(event);" OnClick="NavHelp_Click" ToolTip="Help" runat="server"></asp:LinkButton>

Javascript function (definitely being hit)

function showConfirm(event) {
  event.stopPropagation();
  return false;
}

However after showConfirm returns false the link button still posts back to the server side NavHelp method.

As a side note, I also put a breakpoint in the __doPostback method generated by .NET and it does get hit after showConfirm returns false.

Can anyone shed any light on this?

score 7 · Accepted Answer · answered May 23 '13 at 10:04

7

Right, figured it out. I needed to include the return statement in the OnClientClick attribute:

OnClientClick="return showConfirm(event);"

NOT

OnClientClick="showConfirm(event);"

answered May 23 '13 at 10:04

Dan Cook

1,935
7
26
50

score 1 · Answer 2 · answered May 23 '13 at 13:30

incidentally, you can use your original code, but rather than using event.stopPropagation() you can use event.preventDefault()

so your code would be

<asp:LinkButton ID="NavHelp" OnClientClick="showConfirm(event);" OnClick="NavHelp_Click" ToolTip="Help" runat="server"></asp:LinkButton>

function showConfirm(event) {
  event.preventDefault();
  return false;
}

read some more on event.preventDefault() vs event.stopPropagation() here : http://davidwalsh.name/javascript-events

basically the preventDefault prevents the elemnt from carrying out its dfault action, i.e. visting a link or submitting a form, while stoppropagation allows the dfault action to occur, BUT doesn't inform any parent elements that it has happened.

i created a little jsfiddle : http://jsfiddle.net/XgSXr/ that shows you the prevent default, this should allow you to put in your own javascript logic, display modals etc, before successfully pushing through the link click.

This certainly doesn't work for me. Then again, returning false doesn't seem to be working either. — Jonathan Wood, Oct 03 '13 at 22:46

score 1 · Answer 3 · answered Feb 06 '14 at 09:44

This works:

<asp:LinkButton ID="NavHelp" ClientIDMode="Static" OnClientClick="showConfirm(event);" OnClick="NavHelp_Click" ToolTip="Help" runat="server"></asp:LinkButton>
<script>
    $("#NavHelp").click(function(event) {
        if (showConfirm()) {
            event.stopPropagation();
            event.preventDefault();
            return false;
        }
        return true;
    });
</script>

score 0 · Answer 4 · answered May 23 '13 at 13:37

0

Add Return statement in onClientClick Javascript Event

OnClientClick="return showConfirm(event);"

So when showConfirm return false then request will not be transer to server and page not postback.

answered May 23 '13 at 13:37

Pankaj Agarwal

11,191
12
43
59

Prevent LinkButton post back OnClientClick not working. Why?

4 Answers4

Linked

Related