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 9 of 9
  1. #1
    New to the CF scene
    Join Date
    Mar 2005
    Location
    USA - Indiana
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Changing onClick code with JavaScript

    Hi,

    I have a table with a series of buttons down the left side. These buttons have an onClick handler that selects items and adds them to that line in the table. I am trying to change the function of the button so that it edits the line of data after it has been used to add the line of data.

    linebutton=getElementByID('btn1');
    linebutton.value='Edit'; // i.e. change the button label (this works)
    linebutton.setAttribute("onclick","openpopup('edititem.php?line='"+lineno+"',400,200,'',0,0,0,0,0);" );
    // This succeeds in changing the
    // the code stored in the onclick
    // attribute, but it will not execute

    When I click on the button (now labeled 'Edit'), nothing happens. I suspect the event handler must be re-activated somehow, but I can't seem to figure it out. Would someone please give me some guidance?

    Thanks.

    Steve
    Last edited by smulliki; 03-25-2005 at 06:21 PM.

  • #2
    Regular Coder
    Join Date
    Feb 2004
    Posts
    192
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'll try to help. Much like how setAttribute("class",...) doesn't work and why you need to do setAttribute("className",...) to work, with IE setAttribute("onclick"...) does not work it has to be [element].onClick = [function] and remember when you put the function name in there leave the parentheses out. So your code will look something like

    node1.onClick = toggle;

  • #3
    Regular Coder
    Join Date
    Feb 2004
    Posts
    192
    Thanks
    0
    Thanked 0 Times in 0 Posts
    And actually let me make another a caveat you can also do it like this:

    foo.attachEvent('onclick',functionName);

    I got that from another website while I was learning

  • #4
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    attachEvent is an IE only method... so that I guess that the best crossbrowser solution is

    object.onclick=function(){
    ...code lines...
    }

    In your case:
    inebutton.onclick=function(){
    openpopup('edititem.php?line='"+lineno+"',400,200,'',0,0,0,0,0);
    }

    ...on the other hand you must know that event handlers are not HTML attributes, so that you may not change them using setAttribute() method.
    Last edited by Kor; 03-31-2005 at 09:23 AM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #5
    Regular Coder
    Join Date
    Feb 2004
    Posts
    192
    Thanks
    0
    Thanked 0 Times in 0 Posts
    KOR, how did you find out that onClick is not an HTML attribute (I mean other than the fact that you can't use setAttribute). If I had read that somewhere about what is an HTML attribute and what isn't I think I would have saved myself a lot of grief, and smulliki as well. Is there more literature about what is an HTML attribute and what isn't, and what those other "seeming" HTML attributes are in fact? Thanks.

  • #6
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    onclick, as well as the other event handlers are javascript addons. So that they are not HTML attributes. They have no values, they fire some javascript functions or they write some javascript code lines...

    Same with CSS pointers style and class. They are CSS addons, thus they are not HTML attributes. To manipulate them on the fly you have to use
    object.style
    object.className
    and not settAttribute() method
    Last edited by Kor; 03-31-2005 at 02:17 PM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #7
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Event handlers are both HTML attribute and event handler at the same time. The difference is that HTML attributes are parsed by HTML parser while handlers by Javascript parser. Event handlers are not strings but Javascript statement or expression.

    http://www.codingforums.com/showthre...364#post232758
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #8
    New Coder
    Join Date
    Jul 2005
    Location
    Fife, Scotland
    Posts
    15
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Kor View Post
    object.onclick=function(){
    ...code lines...
    }

    In your case:
    inebutton.onclick=function(){
    openpopup('edititem.php?line='"+lineno+"',400,200,'',0,0,0,0,0);
    }
    Hi, Im having a similar problem, where I cant get the onclick to change dynamically. Heres my code:
    Code:
    var next=document.getElementById('nextPhoto');
    next.href='album.asp?PhotoID='+arrPhoto[i+1][0];
    next.onClick=function(){displayPic(arrPhoto[i+1][0]);};
    It changes the href value no problem, just not the onClick.

    Any help greatly appreciated...
    COYS!

  • #9
    New Coder
    Join Date
    Jul 2005
    Location
    Fife, Scotland
    Posts
    15
    Thanks
    2
    Thanked 0 Times in 0 Posts
    ok, so its been a long morning.

    After (another) review of the code I noticed my fatal mistake; onClick instead of onclick!

    Arrrrrrgh....................
    COYS!


  •  

    Posting Permissions

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