Just want to mention that the code that Cathi posted will not work with browsers based off the new mozilla engine (in case it matters). Seems there is a problem getting the "TBODY" object reference using:
var TableBody = Table.firstChild;
You can fix this by changing the line to:
var TableBody = Table.lastChild;
Note that I have not tested using other HTML 4.0 / DOM compliant browsers such as opera.
>Thank you Cathi,
>Wow... It looks alot like c doesn't it? I will spend the morning with it and update you on my progress.
>As always,
>
>Thank you so much
>Neil
>
>>Neil,
>>
>>Here is an example about how to add a new row to a table using javascript:
>>
>>
>>//Get reference to table.
>>var Table = document.getElementById('ForecastEditor_tblForecasts');
>>
>>//Get reference to table body.
>>var TableBody = Table.firstChild;
>>
>>//Create the new elements
>>var NewRow = document.createElement("tr");
>>var ActionsCell = document.createElement("td");
>>var StartDateCell = document.createElement("td");
>>var StartDateTextbox = document.createElement("input");
>>var EndDateCell = document.createElement("td");
>>var EndDateTextbox = document.createElement("input");
>>var ValueCell = document.createElement("td");
>>var ValueTextbox = document.createElement("input");
>>
>>//Add textboxes to cells
>>StartDateCell.appendChild(StartDateTextbox);
>>EndDateCell.appendChild(EndDateTextbox);
>>ValueCell.appendChild(ValueTextbox);
>>
>>//Add elements to row.
>>NewRow.appendChild(ActionsCell);
>>NewRow.appendChild(StartDateCell);
>>NewRow.appendChild(EndDateCell);
>>NewRow.appendChild(ValueCell);
>>
>>//Add row to table
>>TableBody.appendChild(NewRow);
>>>>
>>Here is an example of changing the background color:
>>
>><html>
>><head>
>><script language="javascript">
>>var highliteColor = "#3366cc";
>>
>>function toggleColor(element){
>> if(element.style.backgroundColor == highliteColor){
>> element.style.backgroundColor = element.sourceColor;
>> }
>> else{
>> element.sourceColor = element.style.backgroundColor;
>> element.style.backgroundColor = highliteColor;
>> }
>>}
>></script>
>></head>
>><body>
>><table border="0" cellpadding="3" cellspacing="1" bgColor="#000000">
>><tr>
>><td style="background-color:#ffffff" onclick="toggleColor(this)">Hello</td>
>><td style="background-color:#cccccc" onclick="toggleColor(this)">World</td>
>></tr>
>></body></html>
>>>>
>>>Hi,
>>>
>>>I built a 1 row, 5 column html table in the page load event. I have complete server side control of all of the cells in the table via:
>>>
>>>
>>>this.Table1.Row[0].Cells[0].Text = "my cell text" ;
>>>
>>>
>>>or I can set a property of a cell via:
>>>
>>>this.Table1.Row[0].Cells[0].BackColor=Color.Yellow;
>>>
>>>
>>>But now I need to control some the properties and text via client side JavaScript. How do I need to set up the table, rows and columns so that I can control these elements via JavaScript. Can someone also offer an example of JavaScript that does this?
>>>
>>>Regards, and thanx,
>>>Neil
Michael McLain
