Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Jul 2002
    Location
    Los Angeles
    Posts
    89
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question onsubmit function, which image button clicked

    I am trying to find out which button I clicked in my form. I've searched and searched and searched, but I haven't found a person that's posted on the problem I am having.

    I have 2 images as a type="image" as buttons in my form. When the buttons are clicked, I don't use a onClick, but let it submit and land in the forms onSubmit() which goes to some function.

    My example leaves out a lot of other code, so I can't use a onClick, but I have to use the onSubmit.

    Is there a way to find out which image button was clicked?

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    
    <html>
    <head>
    	<title>Test Which Button was clicked</title>
    </head>
    
    <body>
    <script language="JavaScript1.2" type="text/javascript">
    	function whichBtn(aForm) {
    		alert("foo");
    		return false;
    	}
    </script>
    <form onsubmit="return whichBtn(this);">
    	<input type="image" src="http://www.codingforums.com/images/buttons/reply.gif" border="0" name="reply" value="Reply to Post" alt="Reply to Post">&nbsp;&nbsp;
        <input type="image" src="http://www.codingforums.com/images/buttons/reply_small.gif" border="0" name="quote" value="Quote the post" alt="Quote the post">
    </form>
    
    
    </body>
    </html>

  • #2
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    As I am sure your aware, input type=image acts the same as input type=submit. However, there is no reason why you can not also attach an onclick event handler to it and add a flag.

    ATM: This is the easiest way I can think of to do what you want, provided of course there is no compelling reason why you can not attach an onclick event handler....

    Code:
    <script type="text/javascript">
     var foo;
      function whichBtn(aForm) {
       alert(foo);
       return false;
      }
    </script>
    <form onsubmit="return whichBtn(this)">
    	<input type="image" src="http://www.codingforums.com/images/buttons/reply.gif" border="0" name="reply" value="Reply to Post" alt="Reply to Post"
    onclick="foo=this.name">&nbsp;&nbsp;
        <input type="image" src="http://www.codingforums.com/images/buttons/reply_small.gif" border="0" name="quote" value="Quote the post" alt="Quote the post"
    onclick="foo=this.name">
    </form>
    ......Willy

  • #3
    New Coder
    Join Date
    Jul 2002
    Location
    Los Angeles
    Posts
    89
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Amazing. I wasn't expecting a response this weekend. Willy Duitt, thnx for the 411. I hadn't thought of using the onClick event to set a global. Mainly because I didn't realize that the the onSubmit event would still be initialized.

    Live and learn. Thanks again.

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,042
    Thanks
    0
    Thanked 251 Times in 247 Posts
    If the ultimate reason for detecting which submit button is clicked is to enable server-side codes to do appropriate action, then you can just detect it on the server-side instead of client-side. When the page is submitted, image submit buttons are submitted to the server just like any control but it has x and y in the names to tell what coordinates (with respect to the edge of the image) the button is clicked. For example the Reply image is clicked, this is how it looks like when submitted to the server (in case of a GET request, of course POST uses the same form data names):

    reply.x=14&reply.y=17

    So you can tell which button is clicked if you check to see which of these form data have values:

    reply.x
    reply.y
    quote.x
    quote.y


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •