SitePoint Sponsor

User Tag List

Results 1 to 15 of 15
  1. #1
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Writing values into the same page

    Hi i have few questions? can any of you kind kind people help?

    Write i have an array, "company"
    firstly how can i write this to a table, cells? ive been told very quickly.
    if a table cell has an ID like
    Code:
    <td>ID=firstcompany</td>
    using something like
    Code:
    document.all.firstcompany.innerhtml
    will be able to display the result somehow into the required cell.
    CAN any one advise on how to do this?

    and one more little question?
    HOW has my friend some how? protected his source from being seen online? CODE?

  2. #2
    SitePoint Addict xDev's Avatar
    Join Date
    Jul 2003
    Location
    Moncton, New Brunswick, Canada
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    That's the idea, but id is an attribute of the tag itself:
    HTML Code:
    <td id="firstCompany">stuff will appear here</td>
    To access the element you would use:
    document.getElementById('firstCompany');

    document.all only works for ie browsers the correct way to access it is with the method demonstrated above. Other things to remember is that every id has to be unique and document.getElementById has to be written exactly like it is above (lower case word, upper first letter, upper first letter and so on).

    Here is a demonstration of how you can display array elements dynamically in a td using document.getElementByID:
    HTML Code:
    <html>
    <head>
    <title>Editor Results</title>
    <style type="text/css">
    
    table {
    border-collapse: collapse;
    width: 500px;
    border: 2px ridge #eee;
    font: 8pt verdana, sans-serif;
    }
    th {
    padding: 4px;
    background: #fff;
    }
    td {
    border: 1px solid #333;
    color: #000;
    background: #eee;
    padding: 4px;
    font-size: 9pt;
    }
    </style>
    <script type="text/javascript">
    var company = new Array("American Republic Insurance Co.",
    "Briggs Corporation","Grinnell College",
    "Iowa Workforce Development","MidAmerican Energy");
    var i = 0;
    function displayCompanies()
    {
      if(i == company.length) i = 0;
      document.getElementById('display').innerHTML = company[i];
      document.getElementById('numbs').innerHTML = "company["+i+"]";
      i++;
    }
    </script>
    </head>
    
    <body>
    
    <table>
    <tr>
    <th>Companies Array</th>
    </tr>
    <tr>
    <td id="display">
    Array Values
    </td>
    </tr>
    </table>
    
    <a href="#" onclick="displayCompanies(); 
    return false;">Display( displayCompanies() )</a> |
    <span id="numbs">
    company[]
    </span>
    
    <p>
    <pre>
    var company = new Array("American Republic Insurance Co.",
    "Briggs Corporation","Grinnell College",
    "Iowa Workforce Development","MidAmerican Energy");
    var i = 0;
    function displayCompanies()
    {
      if(i == company.length) i = 0;
      document.getElementById('display').innerHTML = company[i];
      document.getElementById('numbs').innerHTML = "company["+i+"]";
      i++;
    }
    
    </pre>
    </p>
    </body>
    </html>
    Just keep clicking on the display link to go through the array elements one at a time.

    The relevant code that makes it work is this:
    Code:
      document.getElementById('display').innerHTML = company[i];
      document.getElementById('numbs').innerHTML = "company["+i+"]";
    HTML Code:
    <td id="display">
    
    ...and
    
    <span id="numbs">
    2 different id's being set dynamically with new content every time you click display. Let me know if you need more explanation on how it works.

    -xDev

  3. #3
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yeh HOW this working with no loop running throught out the companies 1 > 15 ?
    also the if statment?
    shouldnt it have brakets?
    if(i==bla){
    do this
    }

    ???????? what the i = 0 straight aftr the if( )


    Cheers for this

  4. #4
    SitePoint Addict xDev's Avatar
    Join Date
    Jul 2003
    Location
    Moncton, New Brunswick, Canada
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by abcdef
    yeh HOW this working with no loop running throught out the companies 1 > 15 ?
    also the if statment?
    shouldnt it have brakets?
    if(i==bla){
    do this
    }

    ???????? what the i = 0 straight aftr the if( )


    Cheers for this
    There's no need for a loop because everytime you click the link it calls the function, checks if i == the length of the array and if it does then i is set to 0 again. At the end of the function i is increased by one. i++ is the same as i = i + 1

    The function acts as a sort of loop itself by going through the array indefinetly - start to finish, back to start (when i == the length of the array) etc. The if could of been written with braces but they are not necessary when there is only one line. If you have more than one line in an if block then braces are required.

    if(i == company.length) i = 0; // ok to do

    if(i == company.length)
    i = 0; // ok to do

    if(i == company.length)
    i = 0;
    j = 0; // not OK

    if(i == company.length) {
    i = 0;
    j = 0; // ok to do
    }

    -xDev

  5. #5
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Cheers, You star!
    I follow it now, sorry to be simple, NEW to this JAVASCRIPT.....

    what is the tag <span> and <pre> have you shown that code which goes on page just for showing purposes only ? thanks!

    ALSO, you at all know how i make the souce protected?
    My friend has done this but i cant get hold of him to ask

    Many thanks

  6. #6
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Right, please take a look at this link,
    http://www.tjsaynor.com/test/Main_Site_TESTING.htm
    I cant get what i want to work!
    The cells down the left, first column all have an ID=name0 name1 name2 etc etc!
    I want these cells to recieve the values of the array once sorted!
    Code:
    function sortArray(){
         company.sort(sortByCost);
    	for(i=0; i<=14; i++){	
    	   //document.write(company[i].name + "<br>")
               //document.write(company[i].totalCost + "<br><br>")
    	   document.getElementById('name0').innerHTML = company[i].name;			
    	}
    }
    every thing works as the lines commented out can display the results!
    The line at the bottom however which we are onto dont work and stops the loop! nothing displays either!
    where the ('name0') is i would like ('name' +i) but no point in trying the whole loop yet as not even writing yet to the cells?
    Yours worked, why shouldnt this?

    NEED HELP quick, cheers for every thing

    EDIT i just noticed it does fill the CELL in but all the time with good deal and then quickly refreshes? is this refreshing causing me to think it aint happening when really it is! why is it refreshing like it does?
    Last edited by abcdef; Nov 22, 2003 at 10:03.

  7. #7
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    xDev, you provide excellent support as usual.
    For your reference, we also discussed this project in this thread.

  8. #8
    SitePoint Addict xDev's Avatar
    Join Date
    Jul 2003
    Location
    Moncton, New Brunswick, Canada
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by MikeFoster
    xDev, you provide excellent support as usual.
    For your reference, we also discussed this project in this thread.
    Thanks, I'll post there.

    -xDev

  9. #9
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Please continue this thread here, for the elements matter etc as my problems above discuss? this is ok is'nt it ?

  10. #10
    SitePoint Addict xDev's Avatar
    Join Date
    Jul 2003
    Location
    Moncton, New Brunswick, Canada
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by abcdef
    Please continue this thread here, for the elements matter etc as my problems above discuss? this is ok is'nt it ?
    OK, as I posted before:
    http://www.xdevdesign.com/spf/QUOTES.htm

    Works like you wanted, I think. About the source protected... you can't. Unless you do it server-side, you won't be able to fully protect your source. There are methods such as blocking the right-click:
    <body onselectstart="return false" oncontextmenu="return false">

    But you can still view the source if you go to view -> source in your toolbar.

    -xDev

  11. #11
    SitePoint Addict xDev's Avatar
    Join Date
    Jul 2003
    Location
    Moncton, New Brunswick, Canada
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by abcdef
    what is the tag <span> and <pre> have you shown that code which goes on page just for showing purposes only ? thanks!
    The pre was just to show you the code that makes it so you could get a better handle of what's happening WHILE it's happening.

    The span is the second id that shows the company[0], [1], [2] etc. Just to show which array element your on at the time and to show that its possible to do innerHTML's on more than one tag at a time.

    -xDev

  12. #12
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK THEN NO WORRIES!
    Sorry this topic is now on 2 threads, LOL > i posted there but i think you have seen.
    Im trying to look how you made the right column bold?

    o yeh seen the style, this applies style on all TD's dont it, how canu create a style and say call it for different elements? where you need it ?

  13. #13
    SitePoint Addict xDev's Avatar
    Join Date
    Jul 2003
    Location
    Moncton, New Brunswick, Canada
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by abcdef
    OK THEN NO WORRIES!
    Sorry this topic is now on 2 threads, LOL > i posted there but i think you have seen.
    Im trying to look how you made the right column bold?

    o yeh seen the style, this applies style on all TD's dont it, how canu create a style and say call it for different elements? where you need it ?

    HTML Code:
    <style type="text/css">
    #money td {
    font-weight: bold;
    color: #000;
    }
    </style>
    <table width="100%" border="0" cellpadding="1"
    cellspacing="1" id="money">

    So #money is the id of the table and I say that any td within this table should have a bold style and a color of black (#000, #000000, black).

    Not sure what book to recommend for a beginner but a quick check at Amazon turned up one that got alot of good reviews:
    http://www.amazon.com/exec/obidos/tg...glance&s=books

    -xDev

  14. #14
    always learning . . .
    Join Date
    Nov 2003
    Location
    UK
    Posts
    821
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    EDITED, works fine now. so deleted this
    Cheers xDev and Mike, great help
    Last edited by abcdef; Nov 23, 2003 at 06:14.

  15. #15
    ♪♪ ♪ ♪ ♪ ♪♪ ♪ ♪♪ Markdidj's Avatar
    Join Date
    Sep 2002
    Location
    Bournemouth, South UK
    Posts
    1,551
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    I may be wrong but if your working with variables it might be better using firstChild.nodeValue instead of innerHTML. I think its abit more cross-browser compliant.
    LiveScript: Putting the "Live" Back into JavaScript
    if live output_as_javascript else output_as_html end if


Bookmarks

Posting Permissions

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