0

I know how to prevent javscript within the href attribute from firing as evident in this JSFiddle (http://jsfiddle.net/mkarr/KNefK/)

However, when this logic is applied to an ASP.Net LinkButton as such:

<asp:LinkButton ID="btnSubmit" runat="server" Text="Submit" OnClientClick="return formTest.validate(event);" OnClick="btnSubmit_Click"></asp:LinkButton>

which translates to:

<a onclick="return formTest.validate(event);" id="ctl00_m_g_87932399_e546_4e12_8297_982b811d8cea_ctl00_btnSubmit" href="javascript:WebForm_DoPostBackWithOptions('blah blah blah')">Submit</a>

The formTest.validate() method does execute correctly and returns false, but the WebForm_DoPostBackWithOptions is always fired immediately after!

Can anyone see any flaws in my logic that I cannot??

EDIT:

Also, several stack overflow solutions have been accepted for this issue but all of them are doing virtually what I have already done leading me to believe I'm missing something simple!

ANSWER:

Since I cannot answer my own question because I'm not reputable yet (LOL), here's an edit with the answer:

Going off @QBM5's original tip of not using ASP.Net controls, I solve the problem, although I still do not know why the initial problem occurred in the first place (does anyone when it comes to ASP.Net? Turn it off, then back on comes to mind here) :o)

I replaced the LinkButton ASP.Net control with the following:

<input type="submit" value="Submit" id="btnSubmitButton" runat="server" OnServerClick="btnSubmitButton_Click" class="submitBtn" />

I then bound the .submitBtn's click event via jQuery:

$('.submitBtn').on('click', function (e) {
    if (!instance.validate()) {
        e.preventDefault();
    }
});

The trick is to use OnServerClick and runat="server" on the control but getting away from LinkButton was the goal and the postback behavior is completely different.

which translates to this:

<input onclick="if (typeof(Page_ClientValidate) == 'function') Page_ClientValidate(''); "  type="submit" id="ctl00_m_g_87932399_e546_4e12_8297_982b811d8cea_ctl00_btnSubmitButton" value="Submit" class="submitBtn">

Anyone want to take a stab at the root cause? I need to move foward so don't have time. :o)

Community
  • 1
  • 1
Michael
  • 41
  • 10
  • 2
    As someone who used asp.net for years, I can say the simplest way to fix this is to not use asp.net controls at all. Use all native html, javascript and js validation. Trying to work with asp.net controls will only break your heart. IMHO – QBM5 Jun 27 '14 at 17:13
  • QBM5: Good point, but that doesn't really help without outlining a way to approach it when a postback is necessary to process the form. – Michael Jun 27 '14 at 17:18
  • This seems weird. If you want to do validation before the form submits, then set up validators and the form won't submit if any of them return false. What is formTest.validate if it isn't validation? Do you want to avoid the ASP validators for some reason? – Daniel Jun 27 '14 at 17:29
  • Are you using Ajax UpdatePanel or PostBack to different page? – Win Jun 27 '14 at 17:37
  • Okay, I just looked at your fiddle and QBM5's comment makes a lot of sense based upon that. You are using ASP.NET webforms, but sort of trying not to use it. If you want to rely so heavily on JavaScript which you write yourself, perhaps you should rethink even using ASP.NET Webforms. If you are required to use ASP.NET Webforms for whatever reason, you should be using the built in validators unless the validation you are doing is too complicated and you must roll your own. Your validation is not too complicated. – Daniel Jun 27 '14 at 17:38
  • Daniel Cook: The validation I am building should be platform independent, therefore yes, I would like to avoid ASP.Net validators. – Michael Jun 27 '14 at 17:39
  • Win: No update panels. Just a few ASP.Net input controls and a LinkButton. The postback is to the same page. – Michael Jun 27 '14 at 17:41
  • Daniel Cook: I have to use ASP.Net, this is for a SharePoint web part. I have reasons like most who post to SO but can't share every single detail and just need a little help, not judgement. However, your suggestion to use ASP.Net validators is warranted should I not have known about them... but still, not the question at hand. :o) – Michael Jun 27 '14 at 17:45
  • Yes my comment was not a solution, it was a snide dig on asp.net and those $%^&* asp controls – QBM5 Jun 27 '14 at 17:58
  • QBM5: Lol.. Yes, most of my development effort is to stay away from depending on a specific platform; especially for client-side work. That way my experience isn't tied to things like ASP.Net validators. – Michael Jun 27 '14 at 18:01
  • Now that you mention sharepoint. I used to do alot of sharepoint dev, and I tried my best to stick to the sharepoint designer and use the controls provided for data management and communication and always had to work 10 times as hard to do anything in sharepoint. Then one day I decided enough was enough. I stopped using the built in sharepoint tools, started using html and javascript (using the sharepoint asmx files for data communication) and everything started becoming much easier. Again, this is not a solution to your problem hat why its a comment and not an answer, sorry for that. – QBM5 Jun 27 '14 at 18:02
  • @Michael the correct way to alert users is "@username", if you do not do that we do not receive notifications. Also note that you can only alert one person per comment. – Daniel Jun 27 '14 at 18:39
  • @DanielCook: Awesome. Didn't know that. Don't use SO often so thank you. – Michael Jun 27 '14 at 19:03

1 Answers1

0

The following is working for me, by changing element.href = "#"

<asp:LinkButton ID="btnSubmit" runat="server" Text="Submit" OnClientClick="return ClientSideValidation()" OnClick="btnSubmit_Click"></asp:LinkButton>

Javascript validation

function ClientSideValidation() {
  var element = document.getElementById("<%=txtAmount.ClientID%>");
  element.href = "";

  if (element.value == "") {

    element.href = "#";
    return false;
  }

  return true;
}
Soon Khai
  • 652
  • 6
  • 13