Can you add onclick to a node created with document.creteElement

and then give onclick a function with arguments

[gasell]

I'd like to have links that when clicked call a function with arguments, but the links itself are created as nodes with javascript.

Also I'm appending nodes to a certain div with id. But in IE7 document.getElementById returns null for that div, even though it gets another div on page with no problem.
The working div has script tag in it, the other one is empty. If I change the order of the divs then the problem goes away, but I want my links after the first div so that's not an option.

I found that node.onclick=func; is the way to attach a function, but it doesn't work for me, when I make node in external .js file and func is defined in head and secondly I can't pass parameters this way.

[MarkFilipak]

> I'd like to have links...

var tagName = '<...whatever...>';
var docFrag = document.createDocumentFragment();
void docFrag.appendChild(document.createTextNode('Click '));
var element = docFrag.appendChild(document.createElement(tagName));
element.setAttribute('onclick', 'myFunction(hardCodedArg1, hardCodedArg2, hardCodedArg3, ...)');
element.style.textDecoration = 'underline';
void element.appendChild(document.createTextNode('here'));
void docFrag.appendChild(document.createTextNode(' to run myFunction.'));
void document.body.appendChild(docFrag); // document.body, just for example -- can be any element.

> IE7 document.getElementById returns null...
Show offending code, please.

> The working div has script tag in it...
From HTML 4.01: "[The script] element may appear any number of times in the HEAD or BODY of an HTML document." It doesn't say that script-elements can appear in divs or any other element (other than head or body), though I see it all the time. I put my scripts only in the head-element. Why do you feel that you need script-elements inside div-elements?

> node.onclick=func...doesn't work for me...
Show offending code, please.

[edited by: MarkFilipak at 5:47 am (utc) on Mar. 16, 2008]

[gasell]

element.setAttribute('onclick', 'myFunction(hardCodedArg1, hardCodedArg2, hardCodedArg3, ...)'); 

The above seems to be very much like what I need, except I just realized I can't hardcode one argument, since it is passed to a function that creates the link (or to be exact I have it as span currently).

About the script tag: I don't really need it there, it has only one function call in it anyway, so I can move it. It does go through the validator though which is probably why I didn't realize it might be wrong.

About null, I have quite a lot of code on several pages, need to find the time to reduce to the minimum needed to reproduce. I have also discovered meanwhile, that when the function is called several times, then starting from second time it is not null any more, even though the div is there from the beginning.

Edit: could I use something like

first.setAttribute.onclick = function (){
  alert("?");
  displayResults(1, onPage)};

onPage being the attribute I can't hardcode.

[gasell]

Oh, wait, not:

[b]first.setAttribute.onclick[/b] = function (){
alert("?");
displayResults(1, onPage)}; 

but

[b]first.onclick[/b] = function (){
alert("?");
displayResults(1, onPage)}; 

I like that I can use such inner function!

[gasell]

Count this thread as solved.

I managed to use my function in a div preceding the div it was looking for. So it was null because IE hadn't finished loading it yet. Put it in body onload and problem solved.