Thank you. That works great for reading the contents of the cell. I actually used outerHTML for reading from the cell because I needed all of the HTML formatting attributes. I was able to write back to the cell via:
cellTxt.innerHTML="Text to write back.."
Thank you for your help. Now I can complete my work of attempting to improve the client's viewing experience by limiting redraws and screen flicker secondary to server postbacks.
Neil
>You can use:
>
>
>function GetCellStuff()
>{
> var cellTxt=document.getElementById('DateID');
> alert('The cell value is: ' + cellTxt.innerHTML); return false;
>}
>
>>
>>Thank you. I have an addtional question. I have a simple one row, 5 cell table. The first cell contains the date 2/29/2004. I set up a simple script to gain access to the cell. I can get to the id, align and valign attributes of the cell once I getElementById. But how do I get to the text (2/29/2004). GetCellStuff() is set up to ALERT() the id (for this example) but what would be the syntax to get to 2/29/2004. The properties text and value do not work.
>>
>>
>><td id="DateID" align="Left" valign="Top">2/29/2004</td>
>>
>><script language='javascript'>
>> function GetCellStuff()
>> {
>> var cellTxt=document.getElementById('DateID');
>> // return false to prevent server control post back
>> alert('The property is: ' + cellTxt.id); return false;
>> }
>></script>
>>>>
>>Thank you,
>>Neil
>>
>>
>>>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
