1,105,320 Community Members

add onclick event programmatically

Member Avatar
zaki
Newbie Poster
3 posts since May 2005
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

I have a code that I call from Button_click event.
The code adds a new row to the table and attempts
to add onclick element to every td element in the new row.
Somehow, onclick does not work.
Any help is appreciated.
Here is the code:

function insRow()
{
var x = document.getElementById('Table1').insertRow(1);
for(i=0;i<4;i++)
{
var td = document.createElement('td');
td.innerHTML = 'NewItem';
td.setAttribute('onclick', 'alert("blabla")');
x.appendChild(td);
}
}
Member Avatar
alpha_foobar
Junior Poster
182 posts since May 2005
Reputation Points: 5 [?]
Q&As Helped to Solve: 5 [?]
Skill Endorsements: 0 [?]
 
0
 

hey,
your code works in firefox. so i'd say it pretty close to working in IE. the only change i had to make was in regards to the table row index.. but i presume you already have a row in your table.

Member Avatar
zaki
Newbie Poster
3 posts since May 2005
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

hey,
your code works in firefox. so i'd say it pretty close to working in IE. the only change i had to make was in regards to the table row index.. but i presume you already have a row in your table.

The first line of my code adds a new row to the table.
I don't know what is wrong with the code, it just doesn't work...

Member Avatar
alpha_foobar
Junior Poster
182 posts since May 2005
Reputation Points: 5 [?]
Q&As Helped to Solve: 5 [?]
Skill Endorsements: 0 [?]
 
0
 

i changed insertRow(1); to insertRow(0); and it added the row in firefox. (1 is the second index of a table row).

when i added it, it worked in firefox on linux... so your not far off.

Member Avatar
zaki
Newbie Poster
3 posts since May 2005
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Did you check if the cells in the new row have onclick event associated with them, that what my problem is, not that the row didn't appear. Thanks for your help, anyway.

Member Avatar
alpha_foobar
Junior Poster
182 posts since May 2005
Reputation Points: 5 [?]
Q&As Helped to Solve: 5 [?]
Skill Endorsements: 0 [?]
 
0
 

yeah, thats what i'm saying.. it worked in mozilla.. you can get the windows jscript debugger.. i find it a hunk of $h!t so i use firefox and the venkman debugger...

but if you place the javascript keyword debugger in your code, and use the ms debugger it works ok.

and everything works in moz. :)

Member Avatar
jchase
Newbie Poster
2 posts since May 2005
Reputation Points: 0 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
0
 

try:
td.attachEvent('onclick', 'alert("blabla")');

Member Avatar
alpha_foobar
Junior Poster
182 posts since May 2005
Reputation Points: 5 [?]
Q&As Helped to Solve: 5 [?]
Skill Endorsements: 0 [?]
 
0
 

the function attachEvent is IE specific, so if this code still doesn't work, this is a possible solution for IE browsers. And could be used as follows:

if( td.attachEvent ){
   td.attachEvent('onclick', 'alert("blabla")');
} else {
   td.setAttribute('onclick', 'alert("blabla")'); 
}
Member Avatar
jchase
Newbie Poster
2 posts since May 2005
Reputation Points: 0 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
0
 

actually, i think you hand in a handle to the function (not a string) and I don't think you can hand in parameters into the function. Thus, check this out to help understand how you can still pass in parameters to an onclick.

function myOnclick() {
sendingObj = event.srcElement;
alert (sendingObj.myProperty);
}

...
img.myProperty = "blahblah";
img.attachEvent("onclick", myOnclick); //notice, no brackets... no parametes, no quotes

Member Avatar
talen
Newbie Poster
1 post since Jan 2006
Reputation Points: 0 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
0
 

here is what works for me both on mozilla and ie


object.onchange = function() {nameOfYourFunction(parameter1, parameter2, etc)} ;

Member Avatar
Singular
Newbie Poster
1 post since Feb 2008
Reputation Points: 0 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
0
 

actually, i think you hand in a handle to the function (not a string) and I don't think you can hand in parameters into the function. Thus, check this out to help understand how you can still pass in parameters to an onclick.

function myOnclick() {
sendingObj = event.srcElement;
alert (sendingObj.myProperty);
}

...
img.myProperty = "blahblah";
img.attachEvent("onclick", myOnclick); //notice, no brackets... no parametes, no quotes

This is correct but you can always use an annonymous function like :

img.attachEvent("onclick", function () {alert('More then one way to skin a cat')});

Member Avatar
jegadeeshkumar
Newbie Poster
1 post since Jan 2010
Reputation Points: 0 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
0
 

Hi, using the following works well in both IE and FF.

myInput.onclick=new Function("SortColumn(this)");

Member Avatar
Clemsy
Newbie Poster
1 post since Apr 2010
Reputation Points: 0 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
0
 

Yes, the last one worked great. Thank you talen.

Member Avatar
olum1989
Newbie Poster
1 post since Jan 2011
Reputation Points: 0 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
0
 

I liked it " talen " . Thank you for your sharing :)

Member Avatar
giveitarip
Newbie Poster
1 post since Mar 2011
Reputation Points: 0 [?]
Q&As Helped to Solve: 1 [?]
Skill Endorsements: 0 [?]
 
0
 

THANK YOU talen!!! This was making me nuts. Your solution worked perfectly for the onclick event I was trying to add through JavaScript with no success...

Question Answered as of 3 Years Ago by alpha_foobar, jchase, Singular and 5 others
You
This question has already been solved: Start a new discussion instead
Post:
Start New Discussion
Tags Related to this Article