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 8 of 8
  1. #1
    New Coder
    Join Date
    Jun 2004
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Put Event Handler in Submit button

    G'day!

    Basically what we have here is some code that displays and image when the submit button is clicked.

    I have been attempting take this event and place it within the input tag. The reason for this is that when the submit button is placed within a form the button submits and overlooks the load image onclick.

    The code below works as is. Of course, as soon as you place the submit button between form tags the problem appears.

    Any help would be greatly appreciated!

    Code:
    <html>
    <head>
    <script type="text/javascript">
         function loading()   //call this function onclick
         {
              document.getElementById("DIV1").style.display = "";  //this will actually
              return true;
         }
         
    </script>
    </head>
    
    <body>
    
    <input type="submit" value="test" name="B1" onclick="return loading();">
    
    <div id="DIV1" style="display:none">
         <img src='N2B_3E2.gif' />
    </div>
    </body>
    </html>

  • #2
    Regular Coder
    Join Date
    Aug 2003
    Location
    Loughborough University
    Posts
    427
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm sorry, what's the problem with this script? The only thing I can see is that when you click the submit button and the image appears, you don't have long to see it before you are taken to a different page.
    AMD Athlon "Barton" XP 3200+ (11*200.5MHz = 2.2GHz)
    BFG GeForce 6800 Ultra OC 256Mb
    3 * Kingston 256Mb PC3200 DDR400
    Seagate Barracuda 120Gb Ultra ATA-100 and Seagate Barracuda 160Gb, SATA-150

  • #3
    New Coder
    Join Date
    Jun 2004
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm sorry, I should have explained a bit more about the application of this script. It is going to be used for a PHP uploader and I was planning on using an animated GIF as the image which show's a looped "progress bar" until the upload summary page loads. So, there is technically no problem with the code listed above, it is just that it doesn't work for my situation.

  • #4
    Regular Coder
    Join Date
    Aug 2003
    Location
    Loughborough University
    Posts
    427
    Thanks
    0
    Thanked 0 Times in 0 Posts
    OK, so what actually needs to be changed? If N2B_3E2.gif is your animation then I don't know why it needs changing at all.
    AMD Athlon "Barton" XP 3200+ (11*200.5MHz = 2.2GHz)
    BFG GeForce 6800 Ultra OC 256Mb
    3 * Kingston 256Mb PC3200 DDR400
    Seagate Barracuda 120Gb Ultra ATA-100 and Seagate Barracuda 160Gb, SATA-150

  • #5
    New Coder
    Join Date
    Jun 2004
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for your interest in assisting me thus far. I apologize for not explaining things well - I'm trying. Basically I would like to take the code from my original post from a Javascript function and take it down to an event handler within the submit button.

    I want to take the code from my first post from this (example of calling a function):

    Code:
    <HTML>
    <HEAD>
    <TITLE>JavaScript</TITLE>
    <SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT">
    <!--
    
    function alert_box()
       {
       alert("I am displayed from a function");
       }
    
    //-->
    </SCRIPT>
    </HEAD>
    <BODY>
    
    <A HREF="javascript:void(0)" onclick="alert_box()">Display alert</A>
    
    </BODY>
    </HTML>
    To this (event handler running from within the submit button):

    Code:
    <HTML>
    <HEAD>
    </HEAD>
    <BODY>
    <input type="submit" value="Submit" onClick="alert('You clicked the submit button!')">
    </BODY>
    </HTML>
    As I mentioned before, in my original code the image loading is overlooked because the submit button is busy submitting the data (uploading the file in my uploader). If I can place the event handler in the submit button the image will load while the upload proceeds. Typically the files that are uploaded are large enough that there is at least 30 seconds before the upload summary page loads. So you would in fact get a change to see the image load.

    Thanks again for any assistance.

  • #6
    Regular Coder
    Join Date
    Aug 2003
    Location
    Loughborough University
    Posts
    427
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ah, I see. In that case do this:
    Code:
    <input type="submit" value="test" name="B1" onclick="document.getElementById('DIV1').style.display='block';return true;">
    AMD Athlon "Barton" XP 3200+ (11*200.5MHz = 2.2GHz)
    BFG GeForce 6800 Ultra OC 256Mb
    3 * Kingston 256Mb PC3200 DDR400
    Seagate Barracuda 120Gb Ultra ATA-100 and Seagate Barracuda 160Gb, SATA-150

  • #7
    New Coder
    Join Date
    Jun 2004
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thank you! That is exactly what I was looking for. It works perfectly.

    Your patience and help have been greatly appreciated!

  • #8
    Regular Coder
    Join Date
    Aug 2003
    Location
    Loughborough University
    Posts
    427
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Happy to help.
    AMD Athlon "Barton" XP 3200+ (11*200.5MHz = 2.2GHz)
    BFG GeForce 6800 Ultra OC 256Mb
    3 * Kingston 256Mb PC3200 DDR400
    Seagate Barracuda 120Gb Ultra ATA-100 and Seagate Barracuda 160Gb, SATA-150


  •  

    Posting Permissions

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