dynamic button onclick event not working

[Dipin]

Hi All;

I have this javascript which is adding a new button to the column in
the row which is created dynamically, the innerhtml shows that the
onclick event is correctly added but it never gets invoked when I
click it.

newcol = doc.createEleme nt("TD");
newbutton = doc.createEleme nt("input");
newbutton.name = "newChange"+__u id;
newbutton.width = 15;
newbutton.heigh t = 15;
newbutton.type = "button";
newbutton.oncli ck = "alert('hi' );";
newcol.appendCh ild(newbutton);
alert(newcol.in nerHTML);
newrow.appendCh ild(newcol);
tbl.appendChild (newrow);
__uid++;
window.close();

Any help will be greatly appreciated.

Thanks
Dipin

[Lee]

Re: dynamic button onclick event not working

Dipin said:[color=blue]
>
>Hi All;
>
>I have this javascript which is adding a new button to the column in
>the row which is created dynamically, the innerhtml shows that the
>onclick event is correctly added but it never gets invoked when I
>click it.
>
> newcol = doc.createEleme nt("TD");
> newbutton = doc.createEleme nt("input");
> newbutton.name = "newChange"+__u id;
> newbutton.width = 15;
> newbutton.heigh t = 15;
> newbutton.type = "button";
> newbutton.oncli ck = "alert('hi' );";[/color]

In HTML, the onclick attribute has a string value, but in
JavaScript, it is not a string, but a reference to a Function.
One way to accomplish this is:

newbutton.oncli ck=new Function("alert ('hi')");

[Douglas Crockford]

Re: dynamic button onclick event not working

> >I have this javascript which is adding a new button to the column in[color=blue][color=green]
> >the row which is created dynamically, the innerhtml shows that the
> >onclick event is correctly added but it never gets invoked when I
> >click it.
> >
> > newcol = doc.createEleme nt("TD");
> > newbutton = doc.createEleme nt("input");
> > newbutton.name = "newChange"+__u id;
> > newbutton.width = 15;
> > newbutton.heigh t = 15;
> > newbutton.type = "button";
> > newbutton.oncli ck = "alert('hi' );";[/color]
>
> In HTML, the onclick attribute has a string value, but in
> JavaScript, it is not a string, but a reference to a Function.
> One way to accomplish this is:
>
> newbutton.oncli ck=new Function("alert ('hi')");[/color]

The much better way is

newbutton.oncli ck = function () {
alert('hi');
};

http://www.crockford.com/javascript/inheritance.html

[Greg]

Re: dynamic button onclick event not working

dchellani@profe ssionalaccess.c om (Dipin) wrote in message news:<be3e177e. 0308260915.31ba 2845@posting.go ogle.com>...[color=blue]
> Hi All;
>
> I have this javascript which is adding a new button to the column in
> the row which is created dynamically, the innerhtml shows that the
> onclick event is correctly added but it never gets invoked when I
> click it.
>
> newcol = doc.createEleme nt("TD");
> newbutton = doc.createEleme nt("input");
> newbutton.name = "newChange"+__u id;
> newbutton.width = 15;
> newbutton.heigh t = 15;
> newbutton.type = "button";
> newbutton.oncli ck = "alert('hi' );";
> newcol.appendCh ild(newbutton);
> alert(newcol.in nerHTML);
> newrow.appendCh ild(newcol);
> tbl.appendChild (newrow);
> __uid++;
> window.close();
>
> Any help will be greatly appreciated.
>
> Thanks
> Dipin[/color]

Aren't you assigning a string to newbutton.oncli ck? I presume that
typeof(newbutto n.onclick) is string:

<input type="button" id='btn1' value='string' /><br>
<input type="button"id ='btn2' value='anonymou s script block'
onclick='return clickHandler(); '/><br>
<input type="button" id='btn3' value='showFunc tion(btn1)'
onclick="showFu nction(document .getElementById ('btn1'));" /><br>
<input type="button" id='btn4' value='showFunc tion(btn2)'
onclick="showFu nction(document .getElementById ('btn2'));" />
<script type='text/javascript'>
function clickHandler(){
alert('in clickhandler');
return 1;
}
function showFunction(bt n){
alert(btn.oncli ck.toString() + '\ntype: ' + typeof(btn.oncl ick));
}
document.getEle mentById('btn1' ).onclick = 'return clickHandler(); ';
</script>

[DU]

Re: dynamic button onclick event not working

Dipin wrote:[color=blue]
> Hi All;
>
> I have this javascript which is adding a new button to the column in
> the row which is created dynamically, the innerhtml shows that the
> onclick event is correctly added but it never gets invoked when I
> click it.
>
> newcol = doc.createEleme nt("TD");[/color]

newcol = newrow.insertCe ll(index);

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-68927016

[color=blue]
> newbutton = doc.createEleme nt("input");
> newbutton.name = "newChange"+__u id;
> newbutton.width = 15;
> newbutton.heigh t = 15;
> newbutton.type = "button";
> newbutton.oncli ck = "alert('hi' );";[/color]

newbutton.oncli ck = new Function(evt)
{alert("hi");};
[color=blue]
> newcol.appendCh ild(newbutton);
> alert(newcol.in nerHTML);[/color]

Not necessary.
[color=blue]
> newrow.appendCh ild(newcol);[/color]

with insertCell(inde x), the above instruction is no longer needed.
[color=blue]
> tbl.appendChild (newrow);[/color]

Also, much performant is insertRow(index );

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-39872903

insertCell() and insertRow are very well supported among recent browser
versions.
[color=blue]
> __uid++;
> window.close();[/color]

You're closing the window? Why?
[color=blue]
>
> Any help will be greatly appreciated.
>
> Thanks
> Dipin[/color]


DU
--
Javascript and Browser bugs:

http://www10.brinkster.com/doctorunclear/

- Resources, help and tips for Netscape 7.x users and Composer
- Interactive demos on Popup windows, music (audio/midi) in Netscape 7.x

http://www10.brinkster.com/doctorunclear/Netscape7/Netscape7Section.html