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
    Dec 2004
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    writing array links to a specific div using innerHTML

    Hi,
    I'd really, really appreciate any help on this one, as I've gone past the point of smacking my head off a brick wall. Well here goes...

    Basically what I have is an array, which stores a list of names. On clicking a button in the body, I wish to call a function which will print these names into a specific div as links. I'm using a for loop to cycle through the array but it just prints out the last element in the array.

    The div name is 'test' and the function called by clicking on the button is 'printLinks'.



    Hope this isn't too unclear. If anyone can troubleshoot this or suggest an alternative I'd be very grateful.



    <script language="javascript" type="text/javascript">
    var myAarray=new Array()
    myAarray=['amy','andy','anthony','andrew','another'];

    var i;
    max=myAarray.length;
    function printLinks(){
    writit('test');
    }


    function writit(id){
    for (i=0;i<max;i++)
    if (document.getElementById){


    x=document.getElementById(id);
    x.innerHTML='';
    x.innerHTML='<a href='+myAarray[i]+'>'+myAarray[i]+'</a><br>';


    } else if(document.all){
    x=document.all[id];
    x.innerHTML='<a href='+myAarray[i]+'>'+myAarray[i]+'</a><br>';
    } else if(document.layers){
    x=document.layers[id];
    text2='<P class="testclass">'+text+'</p>;';
    x.document.open();
    x.document.write(text2);
    x.document.close();

    }
    }

    </script>



    (based on original script from quirksmode.org)


    cheers.

  • #2
    New Coder
    Join Date
    Dec 2004
    Posts
    16
    Thanks
    0
    Thanked 0 Times in 0 Posts
    i'm not much into Netscape, so here's a simple iE version:
    PHP Code:
    <script>
      var 
    myAarray = new Array('amy','andy','anthony','andrew','another')
      function 
    printLinks()
      {
        
    lnks ""
        
    for (i=0i<myAarray.lengthi++)
          
    lnks += myAarray[i].link(myAarray[i]) + "<BR>"
      
        
    document.all['test'].innerHTML lnks
      
    }
    </script>

    <a href="javascript:printLinks()">Print Links</a><p>

    <div id=test></div> 

  • #3
    Senior Coder
    Join Date
    Jul 2004
    Location
    New Zealand
    Posts
    1,315
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    	<head>
    		<title>48547</title>
    	</head>
    	<body>
    		<ul id="links"></ul>
    		<script type="text/javascript">
    			var list = new Array('amy','andy','anthony','andrew','another');
    
    			for(var i = 0; i < list.length; i++)
    			{
    				var li = document.createElement("li");
    				var a = document.createElement("a");
    				var txt = document.createTextNode(list[i]);
    
    				a.setAttribute("href",list[i]);
    				a.appendChild(txt);
    
    				li.appendChild(a);
    
    				document.getElementById("links").appendChild(li);
    			}
    		</script>
    	</body>
    </html>

  • #4
    New to the CF scene
    Join Date
    Dec 2004
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks so much folks. Hemebond - haven't tried that yet but will let you know how it goes. Aifilaw, thanks a million, exactly what I was looking for and works a treat in IE and Firefox (PC) and in IE (MAC). Is there any way to get that working on Safari / Mozilla for MAC?

    thanks again!

  • #5
    New to the CF scene
    Join Date
    Dec 2004
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok, it gets worse. As well as needing the above code to work within mac (safari and mozilla), I also need to each array to be a multidimensional array.
    The aim is that the links are printed to the div and the url for each link differs from the text of the link e.g.:

    var myAarray= new Array()
    myAarray=[["amy","21312"],["andy","343423"]]

    so that the link 'amy' points to the url '21332"

    I've tried creating a multidimensional array like this and then tried to retrieve those values like this:

    function printLinksA()
    {
    lnks = ""
    for (i=0; i<myAarray.length; i++)
    lnks += myAarray[i].link(myAarray[i][1]) + "<BR>"

    document.all['test'].innerHTML = lnks
    }



    but nothing seems to work.


    Again any help on this would be hugely appreciated.

    thanks again!

  • #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
    Is there any way to get that working on Safari / Mozilla for MAC?
    That is why hemebond gave you a DOM compliant solution. Try it, except that, if you want to replace the div content, you must either to use replaceNode or removeChild methods in before

    In fact, should work even the other solution, but you must use the document.getElementById('id') reference, not document.all
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #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
    Is this of any help?

    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <
    html>
    <
    head>
    <
    title>Untitled Document</title>
    <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <
    meta http-equiv="Content-Style-Type" content="text/css">
    <
    meta http-equiv="Content-Script-Type" content="text/javascript"
    <
    script language="JavaScript" type="text/JavaScript">
    var 
    myAarray= new Array()
    myAarray=[["amy","21312"],["andy","343423"]]
    function 
    printLinksA(){
    var 
    root document.getElementById('test');
    for (
    i=0i<myAarray.lengthi++){
        var 
    document.createElement('a');
        var 
    document.createTextNode(myAarray[i][0]);
        var 
    br document.createElement('br');
        
    a.setAttribute('href',myAarray[i][1]);
        
    a.setAttribute('target','_blank');
        
    a.appendChild(n);
        
    root.appendChild(a);
        if(
    i<myAarray.length-1){
        
    root.appendChild(br)
        }
    }

    </script>
    </head>
    <body leftmargin="20" topmargin="0">
    <a href="#" onclick="printLinksA();return false">PRINT LINK</a> 
    <div id='test'></div>
    </body>
    </html> 
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #8
    New to the CF scene
    Join Date
    Dec 2004
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Kor - absolutely brilliant! Exactly what I needed. Thanks to everyone for all your help.

  • #9
    New to the CF scene
    Join Date
    Jul 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    using div for GmapEZ

    Hi! I'm having almost the same problem, I'm working with GmapEZ and I'm using <div> tag to show maps, but there is a problem. I have a Table like this

    <table>
    <tr>
    <td style="width: 700px;">
    <div id="tabladat" style="overflow:auto; width:700px; height:550px;">
    .... another table
    </div>
    </td>
    <td>
    <div class="GMapEZ GSmallZoomControl GSmallMapTypeControl" id="map" style="overflow:auto; width:400px; height: 550px;">
    </div>
    </td>
    </tr>
    </table>


    I have a javascript for the "map" object :

    function refmapa(latitud, longitud) {
    var txt = "http://maps.google.com/maps?ll=" + latitud + "," + longitud + "&amp;t=k&amp;hl=en";
    document.getElementById("map").innerHTML = "<a href='" + txt + "'></a>"
    }

    However when I execute the servlet nothing happens with the DIV , it just turns white and nothing else. I don't know if it's posible to use the <div> tag this way. Please if somebody could help me with this.

    Thanks

    Rob


  •  

    Posting Permissions

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