ansaurus

Question

Answer 1

+2 A:

var element = document.createElement("input");
element.onclick = function() {alert('Clicked!');};

Max Shawabkeh 2010-02-04 13:30:57

jinx! darn, beat me by one second... shouldn't have put that extra example in!

Andy E 2010-02-04 13:31:28

Actually it seems the timestamp is exactly the same for both our posts. :D

Max Shawabkeh 2010-02-04 13:33:20

Answer 2

+2 A:

Probably the easiest cross-browser way is to set the event name as a property of the element:

Element.onclick = function () 
{
   // do something...
}
Element.onmouseup = function () 
{
   // do something else...
}

Andy E 2010-02-04 13:30:57

Answer 3

+2 A:

Simply, use addEventListener method:

buttonRef.addEventListener("click", function() {
    alert("Blah blah...");
}, false);

(You'll have to Google for cross-browser solution. IE doesn't support addEventListener)

Where buttonRef is a reference to button. How can you get that reference? There's lots of ways to do that. You can use document.getElementById() or any other method from this "family".

Crozin 2010-02-04 13:32:28

It works! I have some difficulties, anything that i eventually added, i received error that xmlObj was null, but i restart VS2008 close some windows and it starts to work. thanks!!

SlimBoy 2010-02-04 15:41:34

Found this link that helped https://developer.mozilla.org/En/DOM:element.addEventListener

SlimBoy 2010-02-04 18:46:33

Answer 4

A:

You have to attach the new event when creating the DOM element.

For example :

var e = document.createElement('input');
e.onclick = function()
            {
               alert('Test');
            };

Boris Guéry 2010-02-04 13:33:33

Answer 5

A:

I'm having problems here... I have tried that but it causes me problems, let me try to explain...

im trying to open xml file, read it and create html object with the properties of the xml, so far so good, but if i try to add the event, xmlObj cames null any ideias??

i have this...

script = "function OnClientDragEnd(dock, args)" +
                         "   {" +
                                "var hidd = document.getElementById('" + HiddenField1.Value + "');" +
                                "hidd.value = dock.get_id();" +
                    //"alert(hidd.value);" +
                                "var xmlDoc = new ActiveXObject('Microsoft.XMLDOM');" +
                                "xmlDoc.async = 'false';" +
                                "xmlDoc.load('Config.xml');" +
                                "xmlObj = xmlDoc.documentElement;" +
                                "if (xmlObj.childNodes.length>0)" +
                                "{" +
                                "   for (var i = 0; i < xmlObj.childNodes.length; i++)" +
                                "   {" +
                                "       if (xmlObj.childNodes(i).getElementsByTagName('Id')[0].text == hidd.value){" +
                                "           var txtTb2 = document.getElementById('" + TextBox4.ClientID + "');" +
                                "           txtTb2.value = xmlObj.childNodes(i).getElementsByTagName('Titulo')[0].text;" +
                                "           y = xmlObj.childNodes(i).getElementsByTagName('Titulo')[0].nextSibling;" +
                                "           yy = xmlObj.childNodes(i).getElementsByTagName('Titulo')[0].previousSibling;" +
                    //"           alert(y.nodeName);" +
                                "           for(i=0;i<yy.text;i++){" +
                                "               alert('aa');" +
                                "               var tbox = document.createElement('input');" +
                                "               tbox.setAttribute('type', 'text');" +
                                "               tbox.setAttribute('value', y.text);" +
                                "               tbox.setAttribute('name', 'name');" +
                                "               var abcd = document.getElementById('spanObjDock');" +
                                "               abcd.appendChild(tbox);" +
                                "               var bt1 = document.createElement('input');" +
                                "               bt1.setAttribute('name', 'mais');" +
                                "               bt1.setAttribute('value', '+');" +
                                "               bt1.setAttribute('type', 'button');" +
                                "               bt1.onclick = function (){alert('Clicked!');};" + //--> this dont work
                                //"               bt1.setAttribute('Click','addRadioButton()');" + //--> and this dont work
                                "               abcd.appendChild(bt1);" +
                                "               var bt2 = document.createElement('input');" +
                                "               bt2.setAttribute('name', 'menos');" +
                                "               bt2.setAttribute('value', '-');" +
                                "               bt2.setAttribute('type', 'button');" +
                                "               abcd.appendChild(bt2);" +
                                "               var break1 = document.createElement('br');" +
                                "               abcd.appendChild(break1);" +
                                "               node = y;" +
                                "               y=y.nextSibling;" +
                                "           }" +
                                "           break;    " +//<input type="button" onclick="" name"as" />
                                "       }" +
                                "   }" +
                                "}" +
                            "}";//+

SlimBoy 2010-02-04 13:43:40

If you want to add more detail to your question, then edit it. If you want to ask a new question, do so. Please don't "Answer" your question with something that isn't an answer.

David Dorward 2010-02-04 13:45:28

@SlimBoy: I have added your update to your question body, please delete this answer. FYI, there are several links just below a question or answer such as `edit | close | delete`. In the future you can use the edit link to update your question with additional information.

Andy E 2010-02-04 14:12:14

ansaurus

tags:

views:

answers:

Add event to button with javascript

related questions