• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 720
  • Last Modified:

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
0
BenoitCharest
Asked:
BenoitCharest
1 Solution
 
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 new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
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
 
BenoitCharestAuthor Commented:
That was exactly what I was looking for.

Thanks
0

Featured Post

Hire Technology Freelancers with Gigs

Work with freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely, and get projects done right.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now