Userscripts.org

hi

i'm creating buttons in a loop and try to add EventListeners like this:

// cr buttons
for (var key in button) {
	var barr = new Array();
	barr[key] = document.createElement("button");
	barr[key].appendChild(document.createTextNode(key));
	barr[key].name = key;
	barr[key].value = button[key];
	barr[key].type = "button";
	barr[key].addEventListener('click', funcGen(button[key]), true);
	emodiv.appendChild(barr[key]);
}

function funcGen(text){
  alert("calling funcGen for " + text);
  return function () {
    alert("meh: " + text);  // or whatever you need to do
  }
}

i'm using GM 0.8.20090123.1 with FF 3.5.3 (on linux - x86_64).

any advice?

TIA, v2

Try this:

// cr buttons
for (var key in button) {
	var barr = document.createElement("button");
	barr.textContent = key;
	barr.name = key;
	barr.value = button[key];
	barr.type = "button";
	barr.addEventListener('click', funcGen, true);
	emodiv.appendChild(barr);
}

function funcGen(event) {
  var text = event.target.value;
  alert("calling funcGen for " + text);
}

@GIJoe
Creates the buttons as expected but now nothing happens. no alert at all :/

It's working...
Make sure you copied correctly the code.

Or this:

for (var key in button) {
	var barr = document.createElement("button");
        var buttonvalue = button[key];
	barr.appendChild(document.createTextNode(key));
	barr.name = key;
	barr.value = buttonvalue;
	barr.type = "button";
	barr.addEventListener('click', function(buttonvalue){
            return function(ev){
               alert(ev.target);
               alert(buttonvalue);
	    };
        }(buttonvalue), false);
	emodiv.appendChild(barr);
}

I'm pretty sure i did...
But it's not working here.. maybe a Firefox bug?

Perhaps a problem in an other part of your script ?

Actually I would modify it more to this:

for (var key in button) {
        var buttonvalue = button[key];
	var singlebutton = document.createElement("button");
	singlebutton.appendChild(document.createTextNode(key));
	singlebutton.setAttribute('name',key);
	singlebutton.setAttribute('value',buttonvalue);
	singlebutton.setAttribute('type',"button");
	emodiv.appendChild(singlebutton);
	singlebutton.addEventListener('click', function(buttonvalue){
            return function(ev){
               alert(ev.target);
               alert(buttonvalue);
	    };
        }(buttonvalue), false);
}

i sent you both a pm with the full script.
can you test it and tell me if it works for you? :/

don't use

div.innerHTML = div.innerHTML + '';

awesome. it works now... thanks! :)