javascript thread: Select a row from dynamically generated table w/o assigning an ID
Needs a little correcting, see below:
----- Original Message -----
From: "Joe Fawcett" <joefawcett@h...>
To: "javascript" <javascript@p...>
Sent: Saturday, November 30, 2002 9:10 AM
Subject: [javascript] Re: Select a row from dynamically generated table w/o
assigning an ID
>
> ----- Original Message -----
> From: "Stan" <sck01@a...>
> To: "javascript" <javascript@p...>
> Sent: Friday, November 29, 2002 7:21 PM
> Subject: [javascript] Select a row from dynamically generated table w/o
> assigning an ID
>
>
> > Any help would be greatly appreciated.
> >
> >
> > I have dynamically created a table of movie actors and their roles. I
need
> > to select a specific movie (i.e. row ) from the table. I have seen how
> > people assign an ID to each row and reference the row by ID. Given the
> > way I am building the table I am unable to assign an ID i.e. <TR ID
#
> > > Is there a way to know which row or cell was clicked in the table and
> > call a function using onClick ?
> >
> > Thank you for your help,
> > Stan
> >
> > function showMovie(castSortFunc)
> > {
> > var chosenMovie=Movie.dropDown().options.selectedIndex;
> > clearMovie(Movie.table,Movie.textAreaSummary());
> > Movie.textAreaSummary().value=movies[chosenMovie].Display();
> >
> > var table=document.getElementById(Movie.table);
> > table=table.firstChild;
> >
> > var headerRow=table.insertRow(table.rows.length);
> > var cell=headerRow.insertCell(0);
> > cell.colSpan=2;
> > cell.bgColor="ffffff";
> > cell.innerHTML="The Cast of "+movies[chosenMovie].Title;
> >
> > headerRow=table.insertRow(table.rows.length);
> > cell=headerRow.insertCell(0);
> > cell.innerHTML="Actor";
> > cell=headerRow.insertCell(1);
> > cell.innerHTML="Role";
> > headerRow.bgColor="ffffff";
> >
> > for(var i=0;i<movies[chosenMovie].Cast.length;i++)
> > {
> > var row=table.insertRow(table.rows.length);
> >
> > row.bgColor=(i%2==0)?"ffcc00":"buttonface";
> > var cell=row.insertCell(0);
> > cell.innerHTML=movies[chosenMovie].Cast[i].FullName();
> > var cell=row.insertCell(1);
> > cell.innerHTML=movies[chosenMovie].Cast[i].Role;
> > }
> >
> Well in IE, for Netscape 6+ you may need some slight modifications, then
> assign an onclick to the row when you create it:
> row.setAttribute("onclick", handleClick);
>
> function handleClick()
> {
> alert(event.srcElement.cells[0].innerHTML);
> //alert the contents of the first cell in the row clicked
> }
>
> Joe
>
Actually you would need to test the srcElement.tagName to see it doesn't
have to be the row it will normally be a 'td' element:
function handleClick()
{
var oRow = (event.srcElement.tagName == "tr" ? event.srcElement :
event.srcElement.parentElement);
alert(oRow.cells[0].innerHTML);
}
Joe