«

I have a table with a dynamic number of rows and cells. From the
nature of the script I am writing, I cannot use IDs.

Each row has from 1 to 3 cells. Javascript tables have cells[] and
rows[].

cells [] is an array of all the cells of the table, supposedly 1D.
rows [] is an array of all the rows of the table. You can grab the
cells from the row click.

I wish to go the other way

Is there any way to find out what row was clicked on by the mouse when
the left most cell is clicked but the script ignores the rest of the
cells in the row.

Camet wrote:
> Is there any way to find out what row was clicked on by the mouse
> when the left most cell is clicked but the script ignores the rest of
> the cells in the row.

You can just go up the parentNode chain from whatever was clicked until you
find a TR.
Then, look at the TR's rowIndex property.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

> You can just go up the parentNode chain from whatever was clicked until you
> find a TR.
> Then, look at the TR's rowIndex property.
>
> --
> Matt Kruse
> http://www.JavascriptToolbox.com
> http://www.AjaxToolbox.com

I do not know what you mean by parentNode in relation to tables. I
have only used those in relation to reading xml files.

Camet wrote on 06 jul 2006 in comp.lang.javascript:

>> You can just go up the parentNode chain from whatever was clicked
>> until you find a TR.
>> Then, look at the TR's rowIndex property.
>>
>> --
>> Matt Kruse
>> http://www.JavascriptToolbox.com
>> http://www.AjaxToolbox.com
>
> I do not know what you mean by parentNode in relation to tables. I
> have only used those in relation to reading xml files.
>
>

In DOM like in any other tree structure,
all elements exept the root["global"]
have a parent[node].

DOM elements are nearly people, who have two.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

> In DOM like in any other tree structure,
> all elements exept the root["global"]
> have a parent[node].
>
> DOM elements are nearly people, who have two.
>
> --
> Evertjan.
> The Netherlands.
> (Please change the x'es to dots in my emailaddress)

Okay, can you please give an example of this in commented code?

Thanks

Camet

"Camet" <> writes:

> I do not know what you mean by parentNode in relation to tables. I
> have only used those in relation to reading xml files.

The XML files are probably read into a W3C DOM structure. The same
thing happens with HTML in a browser, and there is a ECMAScript
binding for the DOM objects and methods that specifies how to use
it:
<URL:http://www.w3.org/TR/DOM-Level-2-HTML/ecma-script-binding.html>

In this case, you can do something like:

function findRowNumber(element) { // element is a descendent of a tr element
while(element.tagName.toLowerCase() != "tr") {
element = element.parentNode; // breaks if no "tr" in path to root
}
return element.rowIndex;
}

and call it when clicking on the table:

<table
onclick="doSomethingWith(findRowNumber(event.targe t||event.srcElement));">
...
</table>

/L
--
Lasse Reichstein Nielsen -
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Lasse Reichstein Nielsen wrote on 06 jul 2006 in comp.lang.javascript:

> "Camet" <> writes:
>
>> I do not know what you mean by parentNode in relation to tables. I
>> have only used those in relation to reading xml files.
>
> The XML files are probably read into a W3C DOM structure. The same
> thing happens with HTML in a browser, and there is a ECMAScript
> binding for the DOM objects and methods that specifies how to use
> it:
> <URL:http://www.w3.org/TR/DOM-Level-2-HTML/ecma-script-binding.html>
>
> In this case, you can do something like:
>
> function findRowNumber(element) { // element is a descendent of a tr
> element
> while(element.tagName.toLowerCase() != "tr") {
> element = element.parentNode; // breaks if no "tr" in path to
> root
> }
> return element.rowIndex;
> }
>
> and call it when clicking on the table:
>
> <table
> onclick="doSomethingWith(findRowNumber(event.targe t||event.srcElemen
> t));"> ...
> </table>

In IE HTML I simply do:

<table border=1>
<tr><td onclick='whichRowandCell(this)'>aaaaa
<td onclick='whichRowandCell(this)'>bbbbb
<tr><td onclick='whichRowandCell(this)'>cccc
<td onclick='whichRowandCell(this)'>ddd
</table>

<script type='text/javascript'>
function whichRowandCell(x){
alert('rowIndex: '+x.parentNode.rowIndex+
'\ncellIndex: '+x.cellIndex)
}
</script>

Should one expect a element between the tr and the td?
I think not.




--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

"Evertjan." <> writes:

> Should one expect a element between the tr and the td?
> I think not.

Not in valid HTML, no. If you put the onclick on the table and use
event.target (with IE fallback to event.srcElement), then you might
need to traverse upwards to find the cell and row (but on the other
hand, you should also remember, as I didn't, the case where you click
on the table between rows.

/L
--
Lasse Reichstein Nielsen -
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'