onclick event

[tourerukcom]

Hi

i wonder if someone can help. Im trying to add a onclick event to a
cell in a table.

// Display Product Groups
otab.rows.cells[1].innerHTML = x.childNodes[0].nodeValue;
otab.rows.cells[1].id = id;
otab.rows.cells[1].onclick = function() {doList(dept ,id ,0,"S");};

I checked and id increments fine but the onclick event always set to
the last one. For example the last id in the loop is 284 and it seems
all the onclick event has id set to 284???


Help!!

 

[Thomas 'PointedEars' Lahn]

[...] Im trying to add a onclick event to a
cell in a table.

// Display Product Groups
otab.rows.cells[1].innerHTML = x.childNodes[0].nodeValue;
otab.rows.cells[1].id = id;
otab.rows.cells[1].onclick = function() {doList(dept ,id ,0,"S");};

I checked and id increments fine but the onclick event always set to
the last one. For example the last id in the loop is 284 and it seems
all the onclick event has id set to 284???

This is a FAQ. Fix your keyboard, then search for "closure". And get a
real name.

<http://jibbering.com/faq/#posting>


PointedEars

 

[tourerukcom]

[...] Im trying to add a onclick event to a
cell in a table.

// Display Product Groups
otab.rows.cells[1].innerHTML =  x.childNodes[0].nodeValue;
otab.rows.cells[1].id = id;
otab.rows.cells[1].onclick = function() {doList(dept ,id ,0,"S");};

I checked and id increments fine but the onclick event always set to
the last one. For example the last id in the loop is 284 and it seems
all the onclick event has id set to 284???

This is a FAQ. Fix your keyboard, then search for "closure". And get a
real name.

<http://jibbering.com/faq/#posting>

PointedEars

if its FAQ why cant i find the answer there are many articles
regarding the onclick subject but not the problem im having. Im just
looking for help not abuse!

 

[Jorge]

Hi

i wonder if someone can help.  Im trying to add a onclick event to a
cell in a table.

// Display Product Groups
otab.rows.cells[1].innerHTML =  x.childNodes[0].nodeValue;
otab.rows.cells[1].id = id;
otab.rows.cells[1].onclick = function() {doList(dept ,id ,0,"S");};

Learn this pattern:

(function (id) {

otab.rows.cells[1].onclick= function () {doList(dept ,id ,
0,"S");};

})(id);

It 'freezes' a variable's value (the value of 'id' in this case).

Or just use 'this' inside the handler:

otab.rows.cells[1].onclick= function () {
doList(dept, this.id, 0, "S");
^^^^^^^
};

 

[tourerukcom]

Hi

i wonder if someone can help.  Im trying to add a onclick event to a
cell in a table.

// Display Product Groups
otab.rows.cells[1].innerHTML =  x.childNodes[0].nodeValue;
otab.rows.cells[1].id = id;
otab.rows.cells[1].onclick = function() {doList(dept ,id ,0,"S");};

Learn this pattern:

(function (id) {

  otab.rows.cells[1].onclick= function () {doList(dept ,id ,
0,"S");};

})(id);

It 'freezes' a variable's value (the value of 'id' in this case).

Or just use 'this' inside the handler:

otab.rows.cells[1].onclick= function () {
  doList(dept, this.id, 0, "S");
               ^^^^^^^

};

Hi
thanks for replying. id in this case is a variable in the function

var ProdGroupID = responseXML.getElementsByTagName("id");

after setting the onlick i do a var ProdGroupID =
responseXML.getElementsByTagName("id");
which dosent show the onclick

i have tried the setattribute which does then show the onlick but when
i click nothing happens??

 

[RobG]

On Apr 5, 8:50 pm, (e-mail address removed) wrote:

Hi
i wonder if someone can help.  Im trying to add a onclick event to a
cell in a table.
// Display Product Groups
otab.rows.cells[1].innerHTML =  x.childNodes[0].nodeValue;
otab.rows.cells[1].id = id;
otab.rows.cells[1].onclick = function() {doList(dept ,id ,0,"S");};

Learn this pattern:

(function (id) {

  otab.rows.cells[1].onclick= function () {doList(dept ,id ,
0,"S");};

})(id);

It 'freezes' a variable's value (the value of 'id' in this case).

Or just use 'this' inside the handler:

otab.rows.cells[1].onclick= function () {
  doList(dept, this.id, 0, "S");
               ^^^^^^^
};

Hi
thanks for replying. id in this case is a variable in the function

var ProdGroupID = responseXML.getElementsByTagName("id");

It is a convention that variable names starting with a capital letter
are reserved for constructors.

The line above will assign a reference to a NodeList to prodGroupID.
It isn't a function, nor is there an id variable. The members of the
NodeList will be the id elements in the responseXML (if there are any,
it might be an empty list). Presumably the id elements have content
or an attribute that provides the actual id value. If you want to
access those values, you need to access the members by index.

e.g. if the value is the content of the id element, then for UAs that
support the DOM 3 textContent property:

alert( prodGroupID.textContent );

If the value is in an attribute (say it's called "id"), you may need
to use getAttribute:

alert( prodGroupID.getAttribute('id') );


where "id" is the name of the attribute that has the value you're
after.

after setting the onlick i do a var ProdGroupID =
responseXML.getElementsByTagName("id");
which dosent show the onclick

I don't see prodGroupID referenced anywhere in your listener, so that
is not surprising.

i have tried the setattribute which does then show the onlick but when
i click nothing happens??

Sorry, I don't follow that. Don't use setAttribute for HTML
attribute, just set the DOM property directly as in Jorge's example.

I think you need to show a bit more of the code, what you have posted
so far doesn't really provide enough context.

 

[Garrett Smith]

[...] Im trying to add a onclick event to a
cell in a table.
// Display Product Groups
otab.rows.cells[1].innerHTML = x.childNodes[0].nodeValue;
otab.rows.cells[1].id = id;
otab.rows.cells[1].onclick = function() {doList(dept ,id ,0,"S");};
I checked and id increments fine but the onclick event always set to
the last one. For example the last id in the loop is 284 and it seems
all the onclick event has id set to 284???

You should have posted a reduced, but complete test case. The problem
you are experiencing is likely related to closures and has nothing to do
with table cells or onclick.

You've got to learn how closures work.

There is a pretty good article about that on jibbering (though there is
a mistake in the example of prototype that was pointed out recently).
http://www.jibbering.com/faq/faq_notes/closures.html

| The instance of MyObject1 has a prototype, the default Object
| prototype that corresponds with the object referred to by
| Object.prototype. Object.prototype has a null prototype so the
| prototype chain comes to an end at this point.

Take a look here: http://calculist.blogspot.com/2005/12/gotcha-gotcha.html

Also shown in "The Good Parts," D. Crockford. See pg 39, "BAD EXAMPLE".

Does that look like your problem?

Garrett

if its FAQ why cant i find the answer there are many articles
regarding the onclick subject but not the problem im having. Im just
looking for help not abuse!

You are not the first person to bring up Thomas' obnoxious and hostile
behavior. He seems to do this especially (though not exclusively) toward
new posters. This has been brought up over the years I think as recent
as two days ago.

Garrett

 

[Thomas 'PointedEars' Lahn]

You are not the first person to bring up Thomas' obnoxious and hostile
behavior.

Idiot. I explicitly said what he was to look for and where, but the both of
you have been too stupid to recognize that.


PointedEars

 

[rf]

Idiot. I explicitly said what he was to look for and where, but the
both of you have been too stupid to recognize that.

You really are the perfect example of a **** Wit aren't you, Lahn.