Programming Forums > Web Development and Design > JavaScript and Client-Side Browser Scripting

glevine · Jun 10th, 2005, 9:09 PM

I'm not sure if this is possible. I have tried numerous ways of doing this, so either I am missing something or it just can't be done.

In the body of my page I have a table with 5 rows and 2 colums. I want to display a different string in each cell of the left column and a different integer in each cell of the right column. So it would look something like this:

-----------------
| String 1 | 52 |
| String 2 | 40 |
| String 3 | 13 |
| String 4 | 56 |
| String 5 | 97 |
-----------------

In the head of my page I included 10 variables; 5 for each string and 5 for each integer. In the table cells I want to be able to display the strings and the integers so that I can update them in one place later when needed without having to find each cell in the html code or using a database since the amount of data is so small. Please help if you have any ideas.

Thanks.

Ooble · Jun 11th, 2005, 6:52 AM

If you mean you have the strings and integers in JavaScript variables, you can use the innerHTML property. For example:

(Toggle Plain Text)

...
<script type="text/javascript">
<!--
var myString = "foo";
var myInt = 42;

function fillTable ()
{
    document.getElementById("cell1").innerHTML = myString;
    document.getElementById("cell2").innerHTML = myInt;
}
// -->
</script>
</head>

<body onload="fillTable()">
<table>
    <tr>
        <td id="cell1"></td>
        <td id="cell2"></td>
    </tr>
</table>
...

BaldEagle · Jun 11th, 2005, 3:22 PM

You could also use session variables, although that can be risky. Either way (ooble's or mine) without a db you will still have to find them in code and change them. With session vars you could have a page with a form to modify them, though.

BaldEagle

CrAzY_J · Jun 11th, 2005, 4:25 PM

(Toggle Plain Text)

<script type='text/javascript'>
var na1=['string1','string2','string3','string4','string5'];
var na2=['int1','int2','int3','int4','int5'];

for(i=0;i<na1.length;i++){
var Ta=document.body.getElementById('table1');
Ta.insertRow(i).insertCell(0).innerHTML=na1+na2;
}
</script>

hmmm, cant figure out how to make 2 cells with the rows.
but i should be close

glevine · Jun 11th, 2005, 7:19 PM

I realize that I still have to find the variables in code, but my reasoning was that someone without any knowledge of HTML was going to be updating this specific page on a weekly basis and I was trying to do it in a manner in which they could easily find all of the data in one location within the file without having to download a wysiwyg editor. Using javascript variables allows them to avoid searching through the code for each table cell so they can quickly make simple changes. I was trying not to include more info than was needed, so I left this out and so I can see how excluding this bit of info would lead to confusion about not using a database. Thanks so much for all of your help. I chose to use Ooble's suggestion and it worked exactly as I was hoping.

Ooble · Jun 12th, 2005, 8:37 AM

Good to hear it. I suggest porting it to a server-side scripting language such as PHP when you can so they don't have to touch the code at all, though - this way, if someone has JavaScript turned off, they won't see a damn thing.

Jun 10th, 2005, 9:09 PM	#1
glevine Newbie Join Date: Jun 2005 Posts: 22 Rep Power: 0	text in a table cell I'm not sure if this is possible. I have tried numerous ways of doing this, so either I am missing something or it just can't be done. In the body of my page I have a table with 5 rows and 2 colums. I want to display a different string in each cell of the left column and a different integer in each cell of the right column. So it would look something like this: ----------------- \| String 1 \| 52 \| \| String 2 \| 40 \| \| String 3 \| 13 \| \| String 4 \| 56 \| \| String 5 \| 97 \| ----------------- In the head of my page I included 10 variables; 5 for each string and 5 for each integer. In the table cells I want to be able to display the strings and the integers so that I can update them in one place later when needed without having to find each cell in the html code or using a database since the amount of data is so small. Please help if you have any ideas. Thanks.

Jun 11th, 2005, 6:52 AM	#2
Ooble I eat cake for breakfast. Join Date: Jul 2004 Location: In my box. Posts: 4,434 Rep Power: 9	If you mean you have the strings and integers in JavaScript variables, you can use the innerHTML property. For example: (Toggle Plain Text) ... <script type="text/javascript"> <!-- var myString = "foo"; var myInt = 42; function fillTable () { document.getElementById("cell1").innerHTML = myString; document.getElementById("cell2").innerHTML = myInt; } // --> </script> </head> <body onload="fillTable()"> <table> <tr> <td id="cell1"></td> <td id="cell2"></td> </tr> </table> ... ... <script type="text/javascript"> <!-- var myString = "foo"; var myInt = 42; function fillTable () { document.getElementById("cell1").innerHTML = myString; document.getElementById("cell2").innerHTML = myInt; } // --> </script> </head> <body onload="fillTable()"> <table> <tr> <td id="cell1"></td> <td id="cell2"></td> </tr> </table> ... __________________ Me :: You :: Them

Jun 11th, 2005, 3:22 PM	#3
BaldEagle Newbie Join Date: Apr 2005 Location: Lisbon, CT Posts: 9 Rep Power: 0	You could also use session variables, although that can be risky. Either way (ooble's or mine) without a db you will still have to find them in code and change them. With session vars you could have a page with a form to modify them, though. BaldEagle __________________ If you can't be kind, at least have the decency to be vague. You may be only one person in the world, but you may also be the world to one person. We could learn a lot from crayons. Some are sharp, some are pretty and some are dull. Some have weird names, and all are different colors, but they all manage to live comfortably in the same box.

Jun 11th, 2005, 4:25 PM	#4
CrAzY_J Newbie Join Date: May 2005 Posts: 29 Rep Power: 0	(Toggle Plain Text) <script type='text/javascript'> var na1=['string1','string2','string3','string4','string5']; var na2=['int1','int2','int3','int4','int5']; for(i=0;i<na1.length;i++){ var Ta=document.body.getElementById('table1'); Ta.insertRow(i).insertCell(0).innerHTML=na1+na2; } </script> <script type='text/javascript'> var na1=['string1','string2','string3','string4','string5']; var na2=['int1','int2','int3','int4','int5']; for(i=0;i<na1.length;i++){ var Ta=document.body.getElementById('table1'); Ta.insertRow(i).insertCell(0).innerHTML=na1+na2; } </script> hmmm, cant figure out how to make 2 cells with the rows. but i should be close Last edited by CrAzY_J; Jun 11th, 2005 at 4:30 PM.

Jun 12th, 2005, 8:37 AM	#6
Ooble I eat cake for breakfast. Join Date: Jul 2004 Location: In my box. Posts: 4,434 Rep Power: 9	Good to hear it. I suggest porting it to a server-side scripting language such as PHP when you can so they don't have to touch the code at all, though - this way, if someone has JavaScript turned off, they won't see a damn thing. __________________ Me :: You :: Them

Jun 11th, 2005, 7:19 PM	#5
glevine Newbie Join Date: Jun 2005 Posts: 22 Rep Power: 0	I realize that I still have to find the variables in code, but my reasoning was that someone without any knowledge of HTML was going to be updating this specific page on a weekly basis and I was trying to do it in a manner in which they could easily find all of the data in one location within the file without having to download a wysiwyg editor. Using javascript variables allows them to avoid searching through the code for each table cell so they can quickly make simple changes. I was trying not to include more info than was needed, so I left this out and so I can see how excluding this bit of info would lead to confusion about not using a database. Thanks so much for all of your help. I chose to use Ooble's suggestion and it worked exactly as I was hoping.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Programming Forums > Web Development and Design > JavaScript and Client-Side Browser Scripting

text in a table cell