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
    New Coder
    Join Date
    Jul 2010
    Posts
    22
    Thanks
    3
    Thanked 0 Times in 0 Posts

    To change link dynamically using innerHTML

    Hi,

    Below is my code.
    I am stuck in line shows below.

    Code:
    function createRows() //to create rows using innerHTML
    {
    	var tbody = document.getElementById("CONTENT"); //tbody = your table body
    	tbody.innerHTML = ""; //empty table body
    	for (i=1; i<=73; i++)  
    	{
    		tr = tbody.insertRow(-1); //append a row in table body
    		td = tr.insertCell(-1); td.innerHTML = referenceNo(i); //ref. no
    		td = tr.insertCell(-1); td.innerHTML = trackNo(i);  //track
    		td= tr.insertCell(-1); td.innerHTML = ; //I am stuck here
    	}
    }
    I would like to have function call there where it will receive a value to link it to pdf file and also display the title.

    In HTML, I would be writing it like below. But, I want it to be dynamically set according to the value of i.

    Code:
    <a href="3-Management & Marketing\103.pdf" target="_blank">XXXX</a>
    How to do this? Pls help.
    Last edited by azrina; 03-06-2013 at 12:59 PM.

  • #2
    New Coder
    Join Date
    Jul 2010
    Posts
    22
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Pls look into the code below.
    When run on browser, it cannot find the path.
    What is wrong?

    Code:
    function createRows() //to create rows using innerHTML
    {
    	var tbody = document.getElementById("CONTENT"); //tbody = your table body
    	tbody.innerHTML = ""; //empty table body
    	for (i=1; i<=73; i++)  
    	{
    		tr = tbody.insertRow(-1); //append a row in table body
    		td = tr.insertCell(-1); td.innerHTML = referenceNo(i); //ref. no
    		td = tr.insertCell(-1); td.innerHTML = trackNo(i);  //track
    		td = tr.insertCell(-1); td.innerHTML = getTitle(i); 
    	}
    }
    
    
    /** ----------------------------------------- TO RETURN TITLE -------------------------------------------------*/
    function getTitle(i)
    {
    	var title = "";
    	switch(i)
    	{
    		case 1:
    			title = "<a href=\"3-Management & Marketing\103.pdf\" target=\"_blank\">XXXXX</a>";
    			break;
    	}
    	return title;
    }

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    Backslashes in strings must be doubled:
    Code:
    title = "<a href=\"3-Management & Marketing\\103.pdf\" target=\"_blank\">XXXXX</a>";
    BUt *PROBABLY* that should not be a backslash, anyway. Probably should be forward slash. And keep it simple:
    Code:
    title = '<a href="3-Management & Marketing/103.pdf" target="_blank">XXXXX</a>';
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    azrina (03-06-2013)

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,966
    Thanks
    0
    Thanked 236 Times in 233 Posts
    Why not just store the filenames in an array?
    Code:
    var files = ["3-Management & Marketing/103.pdf", "3-Management & Marketing/xxx.pdf", "3-Management & Marketing/yyy.pdf", ...and so on...];
    Then in the createRows function:
    Code:
    td.innerHTML = '<a href="' + files[i-1] + '" target="_blank">XXXXX</a>';

  • Users who have thanked glenngv for this post:

    azrina (03-06-2013)

  • #5
    New Coder
    Join Date
    Jul 2010
    Posts
    22
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks.
    Both can be used.
    But it is convenient for me not to use array.

  • #6
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,471
    Thanks
    0
    Thanked 634 Times in 624 Posts
    Why not do it properly and get rid of the innerHTML. That way you avoid all the issues of nested quotes.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #7
    New Coder
    Join Date
    Jul 2010
    Posts
    22
    Thanks
    3
    Thanked 0 Times in 0 Posts
    How? Can you explain further?
    I used document.write before this.
    But the code does not work.
    And they suggested innerHTML.
    What is the best solution for this actually?


  •  

    Posting Permissions

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