dynamic image id

[Camet]

I have been trying to create a dynamic id for a number of images in a
table so that I can identify which image was clicked on later. ie I
need to set a variable to the id of each image, that is generated by a
loop. The info is read from an XML file in another function and each
section of info is stored as a separate object; Each object is
pertaining to one row in the table.

function createTable ()
{
var output, dynamId;
output="<table id=thisTableId><TR><TH>.....< \/ TH><\/ TR>" ;

//length is a number given earlier, containing the
//number of rows that need to be in the table

//object is an array of objects, each object containing
//information i want shown in the table

for (var count = 0; count < length; count++)
{
dynamID="img"+ count;
output+= "<TR><TD><img src='images\\littlex.gif' id=dynamID
onClick=work(id)><\ /img><\/ TD>";

//showing the data in the columns
output+= '<TD class=content>' + object[count].name + '<\/ TD>' +
'<TD class=content align=center>' +
object[count].region +
'<\/ TD><\/ TR>';
}

output += "<\/ table>";
}

function work (num)
{
alert (num);
}

My goal is to have an image clickable in each row of the table in the
left column, except for the header. The image should provide some
indication of what row it is located in. This information will be used
to change the information in another cell of the same row, but i know
how to do that part. The various combinations I have tried, generally
return [null], [object] or the last id no matter which image is
pressed. If needed, it is possible to put more variables into the
object.

Any suggestions would be helpful. Thanks in advance

[Richard Cornford]

Camet wrote:

I have been trying to create a dynamic id for a number of
images in a table so that I can identify which image was
clicked on later. ie I need to set a variable to the id
of each image, that is generated by a loop. The info is
read from an XML file in another function and each section
of info is stored as a separate object; Each object is
pertaining to one row in the table.

function createTable ()
{
var output, dynamId;
output="<table id=thisTableId><TR><TH>.....< \/ TH><\/ TR>" ;

//length is a number given earlier, containing the
//number of rows that need to be in the table

//object is an array of objects, each object containing
//information i want shown in the table

for (var count = 0; count < length; count++)
{
dynamID="img"+ count;
output+= "<TR><TD><img src='images\\littlex.gif' id=dynamID
onClick=work(id)><\ /img><\/ TD>";

<snip>

There is nothing in javascript that will examine a string literal for a
sequence of charters and substitute another character sequence for it.
(For the overly pedantic: String.prototype.replace does not act upon
string literals, and is no help here anyway).

So when the character sequence 'dynamID' is used in the string above it
is just that literal character sequence, uninfluenced by the current
value of any local variable with the name 'dynamID'. If you want to
inset the current value of the variable - dynamID - into the string you
would have to construct a string including that value, by concatenation
(or similar means):-

dynamID="img"+ count;
output+= "... <img src='...' id='"+dynamID+"' onClick=work(id)> ...";

Incidentally, the onclick handler created from - work(id) - is going to
have to resolve - id - against its scope chain, and finding the IMG
element with the significant ID on that scope chain is non-standard and
not universally supported. Reading the ID of the IMG element as -
this.id - will be more generally effective.

It is also necessary to put quote marks around attribute values in HTML
when they contain characters that are not allowed in unquoted
attributes. Javascript source code in event handling attribute values
almost never qualifies as suited for not being quoted.

Also, in HTML IMG elements must not have closing tags, and all those
extra spaces in your closing tags are very likely to confuse browsers.

Richard.

[Thomas 'PointedEars' Lahn]

Richard Cornford wrote:

There is nothing in javascript that will examine a string literal for a
sequence of charters and substitute another character sequence for it.
(For the overly pedantic: String.prototype.replace does not act upon
string literals, and is no help here anyway).

Huh?

"foo".replace(/o/g, "bar") // "fbarbar" in any ES Ed. 3 implementation
PointedEars
--
Bill Gates isn't the devil -- Satan made sure hell
_worked_ before he opened it to the damned ...

[Richard Cornford]

Thomas 'PointedEars' Lahn wrote:

Richard Cornford wrote:

There is nothing in javascript that will examine a string
literal for a sequence of charters and substitute another
character sequence for it. (For the overly pedantic:
String.prototype.replace does not act upon string literals,
and is no help here anyway).

Huh?

"foo".replace(/o/g, "bar") // "fbarbar" in any ES Ed. 3
implementation

The dot operator implicitly type-converts its right hand side operand
into an object, where string primitives become String objects.

Richard.

[Thomas 'PointedEars' Lahn]

Richard Cornford wrote:

Thomas 'PointedEars' Lahn wrote:

Richard Cornford wrote:

There is nothing in javascript that will examine a string
literal for a sequence of charters and substitute another
character sequence for it. (For the overly pedantic:
String.prototype.replace does not act upon string literals,
and is no help here anyway).

Huh?

"foo".replace(/o/g, "bar") // "fbarbar" in any ES Ed. 3
implementation

The dot operator implicitly type-converts its right hand side operand
into an object, where string primitives become String objects.

ACK. But to be "overly pedantic": You did not say "string value", you
said "string literal" :)
PointedEars

[Richard Cornford]

Thomas 'PointedEars' Lahn wrote:

Richard Cornford wrote:

Thomas 'PointedEars' Lahn wrote:

Richard Cornford wrote:
There is nothing in javascript that will examine a string
literal for a sequence of charters and substitute another
character sequence for it. (For the overly pedantic:
String.prototype.replace does not act upon string
literals, and is no help here anyway).

Huh?

"foo".replace(/o/g, "bar") // "fbarbar" in any ES Ed. 3
implementation
The dot operator implicitly type-converts its right hand side
operand into an object, where string primitives become String
objects.

ACK. But to be "overly pedantic": You did not say
"string value",

I probably should have said "string primitive".
you said "string literal" :)

In the context of excluding them, which is not false, if not completely
precise.

Richard.