Accessing Table properties with DHTML

[dru]

Hi,

I am playing around with iFrames and DHTML. at the moment i am having trouble accessing the properties of selected table in an iframe. furthermore this table doesn't have an id so i can't access it using the getelementbyID method. I have seen the .selectedTable command before but i have not been able to find any documentation for it on the web. (probably an IE only property) any help is appreciated.

Thanks

[Fang]

It's only with IE that it's possible to find which element has the focus (I'm not 100% certain).
If there's only one table without an id then:

var TableArray=document.getElementsByTagName('table');
for (i=0; i < TableArray.length; i++) {
if(!TableArray[i].getAttribute("id")) {
// Table with no id;
}
}

For IE only use:
document.activeElement

[dru]

actually none of the possible tables have ids. but how do i access the selected table? in editable iFrames, when a table is selected, a resizable box is drawn around the object.

[Fang]

If there's a box around it, with an id then:
document.getElementById("box").firstChild.nodeName
should be your table.

[dru]

I am not sure what you mean by the box with an id. i don't know the id of the table or the box around it, attatched is a snapshot of the box around the selected table that automatically appears when the table is selected in designMode. something that could be used in WYSIWYG editors.

[Fang]

This will give you the text contents of the table:

if(navigator.userAgent.indexOf("MSIE")!=-1) {
alert(document.selection.createRange().text);
}
else {
selObj = ;
alert(window.getSelection());
}

[dru]

Thank you for the reply, this functionality that i am looking for could be an Internet Explorer specific code, cuz only a person with IE is supposed to work with my editor. however i don't need to change the text of the table, but i would like to get to attributes of the table by selecting it and changing things like the background color or border size. etc.

[Khalid Ali]

get reference to the table e.g

var tbl = document.getElementById("table1");
//now you can get all the attributes for it

var attList = tbl.getAttributes();

//or you can get a specific atribute

var attribute = table.getAttribute("width");

[Fang]

It would be so much easier with table ids!
This is IE specific. Use some mouse event to trigger it.
The alert will tell you which element has been selected (active).

function WhoAmI() {
if(document.activeElement.tagName=="TABLE") {
document.activeElement.bgColor="red";
document.activeElement.border=10;
}
alert(document.activeElement.tagName)
}