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 7 of 7
  1. #1
    Senior Coder Mhtml's Avatar
    Join Date
    Jun 2002
    Location
    Sydney, Australia
    Posts
    3,531
    Thanks
    0
    Thanked 1 Time in 1 Post

    createElement problems

    Beyond form validation my javascript skills are slightly lacking, so I've run into a problem trying to implement a simple collapsable box.

    Code:
    var linkNum = 0;
    
    function add( parent_element, child_element ){
    	linkNum++;
    	var parent = document.getElementById(parent_element);
    	var child = document.getElementById(child_element);
    	var link = document.createElement("a");
    	link.id = "collapse_link_"+linkNum;
    	link.href = "javascript:collapse(this.id,'"+child_element+"')";
    	link.appendChild(document.createTextNode("-"));
    	parent.insertBefore(link,child);
    }
    
    function collapse( link_id, child_id ){
    	var child = document.getElementById(child_id);
    	var link = document.getElementById(link_id);
    	if( child.style.display == "none" ){
    		child.style.display = "block";
    	}else{
    		child.style.display = "none";
    	}
    }
    
    add( "some_parent", "some_parent_collapsable" );
    Given the ID of a parent and child DIV the script first creates an ANCHOR and then handles requests from to collapse or expand the child DIV element. Now the problem I have is, setting the text for the link. But I can't even seem to get a handle to it so I can't change the text.

    Reason for dynamically creating the element is so users on older browsers won't even see it. I don't doubt there will be some intersection that loses out, where the browser can expand/collapse but can't write the element so misses out sort of needlessly...but I don't care for them, they miss out. But they won't even know they're missing out.

    [edit:] For some reason link_id in collapse() contains link.href instead of link.id
    Last edited by Mhtml; 03-09-2005 at 05:30 AM.
    Omnis mico antequam dominus Spookster!

  • #2
    Regular Coder
    Join Date
    Aug 2004
    Location
    codegoboom@yahoo.com
    Posts
    999
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Putting + link.id + in the href assignment, instead of this.id might help... ('this' could be a ref to 'window').

    What is the typeof 'link_id' (or link)? An anchor may show up as its href when you alert it--even though its the object itself...
    Last edited by codegoboom; 03-09-2005 at 07:11 AM.
    *this message will self destruct in n-seconds*

  • #3
    Senior Coder Mhtml's Avatar
    Join Date
    Jun 2002
    Location
    Sydney, Australia
    Posts
    3,531
    Thanks
    0
    Thanked 1 Time in 1 Post
    Ahh you are correct. It is right, it was just alert()ing the href. Ok. So now how do I change the text?
    Omnis mico antequam dominus Spookster!

  • #4
    Regular Coder
    Join Date
    Aug 2004
    Location
    codegoboom@yahoo.com
    Posts
    999
    Thanks
    0
    Thanked 0 Times in 0 Posts
    link.innerHTML may do...
    *this message will self destruct in n-seconds*

  • #5
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,048
    Thanks
    0
    Thanked 251 Times in 247 Posts
    Quote Originally Posted by Mhtml
    So now how do I change the text?
    Is this what you want?

    link.firstChild.nodeValue = (link.firstChild.nodeValue == '-') ? '+' : '-';


    I suggest you call collapse() onclick rather than in href.

    link.href = "#";
    link.onclick = function(){collapse(this.id, child_element); return false;}; //this.id now refers to the current link object

  • #6
    Senior Coder Mhtml's Avatar
    Join Date
    Jun 2002
    Location
    Sydney, Australia
    Posts
    3,531
    Thanks
    0
    Thanked 1 Time in 1 Post
    Ahh ok, I had actually contemplated that perhaps onclick was better. And in fact I was planning on doing it like that but I did href instead.

    It's working now. Thanks guys.
    Omnis mico antequam dominus Spookster!

  • #7
    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
    hm... nodeValue is recomanded as a readonly attribute, would'nt be data a better choise?
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

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