www.webdeveloper.com
Results 1 to 8 of 8

Thread: onClick not responsive... I'm going to lose it

Hybrid View

  1. #1
    Join Date
    Jul 2010
    Posts
    18

    onClick not responsive... I'm going to lose it

    Hello!!

    I can't, for the life of me, figure out why this code is unresponsive. When I first wrote it it worked once, then never again. Here it is:

    Embeded javascript (in head tag):

    Code:
    <script type="text/javascript">
    
    function deleteConfirm(){
    
        var confirmDel = confirm("Are you sure you want to delete this image?");
    
        if(confirmDel){
             //Continue to edit.php
        }else{
             return false;
        }
    
    }
    </script>
    HTML:

    HTML Code:
    <form name="deleteForm" id="deleteForm" method="post" action="edit.php">
    
         <input type="submit" name="btnDelete" id="btnDelete" title="Delete Image" value="X" onClick="return deleteConfirm()" />
    
    </form>
    So, I've tried everything I can think to fix this but for some reason it just doesn't do anything. Even if I replace the confirm script with a simple alert: nothing. I added window.onload = function(){ alert("Hello"); } and that worked just fine.

    For the actual onClick script I've done onClick, onclick, added a ';' at the end of the brackets...

  2. #2
    Join Date
    Sep 2010
    Posts
    6
    Combined the above code to a web page and the page works for me.

    Code:
    <!doctype html>
    <html>
    <head>
    <script type="text/javascript">
    function deleteConfirm(){
        var confirmDel = confirm("Are you sure you want to delete this image?");
        if(confirmDel){
             //Continue to edit.php
        }else{
             return false;
        }
    }
    </script>
    </head>
    <body>
    <form name="deleteForm" id="deleteForm" method="post" action="edit.php">
         <input type="submit" name="btnDelete" id="btnDelete" title="Delete Image" value="X" onClick="return deleteConfirm()" />
    </form>
    </body>
    </html>
    I have also created a dummy edit.php on localhost and everything is ok.

    Does this code work for you?
    What browser are you using?

    Edit: just noticed that when the doctype is missing the code is not working as expected, see if yours is valid.
    Last edited by FrioLazzlo; 09-20-2010 at 08:22 AM. Reason: update

  3. #3
    Join Date
    Jul 2010
    Posts
    18
    Hi Frio, thanks for you quick reply.

    I'm using IE7 and here's the code for the doctype:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">

    So as of now, when I press the delete button it automatically goes to edit.php without an alert popup.

  4. #4
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    To avoid any misinterpretation from the browser's interpreter, you'd better prevent the proper event. As you need to control the submit action, that means you must use the onsubmit event, applied on the form element, not the onclick event on the submit button.
    Code:
    function deleteConfirm(){
        var confirmDel = confirm("Are you sure you want to delete this image?");
        if(!confirmDel){
        return false;
        }
    }
    
    ...
    <form name="deleteForm" id="deleteForm" method="post" action="edit.php" onsubmit="return deleteConfirm()">
    <input type="submit" name="btnDelete" id="btnDelete" title="Delete Image" value="X"  />
    </form>

  5. #5
    Join Date
    Jul 2010
    Posts
    18
    Hi Kor

    I have another button within that same form which, when pressed, also goes to the edit.php page and allows the user to edit the image (both the edit script AND the delete script are on the edit.php page). So, if I were to put the onsubmit event in the form tag, it would run the javascript when I hit the edit button as well.


    Perhaps the only solution, then, is to make 2 separate forms and have one with the onsubit event... Although it would be so much easier if I could just use onClick... *sob*

  6. #6
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Could work with onclick (even it is not quite standard) except that, under an XHTML Doctype, you have to use lowercase all over : onclick

  7. #7
    Join Date
    Jul 2010
    Posts
    18
    OK, so... confession time!

    When I posted the original message I had been both weary and frustrated and had been looking at this code for way too long. As many programmers probably know it's best to take a bit away from it and come back when refreshed.

    So, I did that and on the bus ride home from work yesterday it dawned on me.

    The reason the onclick event wasn't working was because it was on the wrong button. I have 5 categories setup with identical code and for whatever reason I only put it on the 1st category but was testing it on the 3rd. Because there was no onclick on the 3rd, it didn't work.

    This also explains why it worked the first time and never again after that as I tested it on the 1st category once.

    I'm terribly sorry for wasting everyone's time and thank you anyway for your help.

  8. #8
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Quote Originally Posted by Adelyra View Post
    The reason the onclick event wasn't working was because it was on the wrong button.
    No problem. You are welcome here whenever you need help. Anyway, keep in mind that different Doctypes need different syntax. And beware of the cross-browser problems.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles