How do I cancel a button click event using ASP .Net or JavaScript?

Hello,

We have an ASP .Net (2.0) Web Site. The Web Site is developed to be used with Internet Explorer.  We have a Mini Cart user control who has a "View Cart" button (type = submit). On the page content, we have a form that the user must fill. Each text box have a JavaScript function so that when we click on ENTER key, it triggers the click event on the form submit button.

The problem is because we have two submit, Internet Explorer makes the first (in the source code) submit button ("View Cart" button) the default one so that when we click on ENTER key when there is no text box selected, it triggers the "View Cart" button.

But we need, for this page (so we can't modify the Mini Cart control), that if we press ENTER key instead of clicking on the default submit button, it does nothing. So we thought about detecting the "onkeydown" event on the body so we can't cancel the "View Cart" button click event if we detect it but it didn't work. So we are searching for a solution either using JavaScript or ASP .Net (C#).

Thanks
BenoitCharestAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

tobzzzCommented:
A solution I have used previously when requiring 2 submit buttons in one page is the following. You should be able to apply this to your problem.
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
	function doProceed(FormRef) {FormRef.action='viewcart.asp'; FormRef.submit()}
	function doRedirect(FormRef) {FormRef.action='goelsewhere.asp'; FormRef.submit()}	
</SCRIPT>
</HEAD>

<BODY>
<FORM>
	<INPUT TYPE="button" VALUE="View Cart" onClick="doProceed(this.form)">
	<INPUT TYPE="button" VALUE="Other Submit" onClick="doRedirect(this.form)">
</FORM>
</BODY>

Open in new window

0
BenoitCharestAuthor Commented:
Thanks for your solution but that's not quite what I'm looking for.

I will try to explain more clearly.

First of all, I can't modify the input type who are "submit" because we use the Mini Cart control on every page of the Web Site (so we don't cause impact on other pages) and we only want to do this to this specific page.

So the solution we thought of was really to just don't allow the user to trigger the "View Cart" button with ENTER key.

We need something more like this:

if(event.keyCode == 13)  // We check if we press ENTER key
{
    if(btnViewCart == btn.Clicked())  // If "View Cart" button
    {
        // Just don't do the click event, we want to cancel it
        return false;
    }
}

Thanks
0
leakim971PluritechnicianCommented:
javascript :

- Assuming :
    - The form to submit is the first one in the page (if you've more than one)
    - Not easy to modify the form tag else we can do simpler : <form onkeyup="checkifcode13();" onsubmit="return submitOrNotSubmit" >

<script language="javascript">
    var submitOrNotSubmit = false;
    window.onload = function() {
       document.forms[0].onsubmit = function(){
           return submitOrNotSubmit;
       }
       document.forms[0].onkeyup = function() {
          if(event.keyCode == 13) {
             submitOrNotSubmit = true;
             document.forms[0].submit();
          }
       } 
    }
</script>

Open in new window

0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

BenoitCharestAuthor Commented:
That's not quite what we need. We do not want to stop the submit.

What we want is (we got the first two):

- If the user is on a text box and he press ENTER  (onkeydown), it clicks the submit button.
- If the user clicks on the "View Cart" button, it clicks on the "View Cart" button (like a normal button)

The problem is the third one:

- If the user press ENTER key and is not in a text box, it does nothing!

But currently it does:

- If the user press ENTER key and is not in a text box, it clicks on the "View Cart" button.

So what we need is a script for this specific page that do like:

IF  (ENTER KEY WAS PRESSED)
   IF( NO TEXTBOXE IS SELECTED)
         // DO NOTHING

OR

IF  (ENTER KEY WAS PRESSED)
   IF( VIEWCART BUTTON IS CLICKED)
         // DO NOTHING

I hope I explained myself more clearly this time.

Thanks
0
Gagan_JauraCommented:
Go through the below code. Put a onkeypress event on body and call checkKey() function by passing empty string. The empty string depicts that the key is pressed when control is not in textbox. The same function is also called from Textbox control also onkeypress. But when user press ENTER from textbox then a id will be passed which indicated that the key is pressed in a textbox. For submit button I am using a different function.
<html>
<head>
<script language="javascript">
function checkKey(id)
{
if (event.keyCode == 13 && id != '')
   alert('Submit');
else
   return false;
}

function checkButton()
{
   alert('Submit');
   return false;
}
</script>

</head>
<body onkeypress="checkKey('');">
<form runat="server" >                        
<input type="input" onkeypress = "checkKey(this.id);" id="Name">
<input type="submit" onclick = "checkButton();" id="Ok">
</form>
</body>
</html>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
BenoitCharestAuthor Commented:
That was exactly what I was looking for.

Thanks
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Networking

From novice to tech pro — start learning today.