Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Events on dynamically generated elements in IE

Reply
Thread Tools

Events on dynamically generated elements in IE

 
 
Harlan Messinger
Guest
Posts: n/a
 
      04-20-2009
I'm using Javascript to insert an HTML element like

<input type="text" name="mytext" id="mytext" value="" onblur="alert('x');">

In both IE7 and Firefox 3, the input field appears, and I can type into
it, but when I tab out of it to the next field, the alert only happens
in Firefox.

Is the problem that IE doesn't bind events for dynamically generated
elements? Is there a way make this happen?
 
Reply With Quote
 
 
 
 
Johannes Hafner
Guest
Posts: n/a
 
      04-20-2009
Harlan Messinger schrieb:
> I'm using Javascript to insert an HTML element like
>
> <input type="text" name="mytext" id="mytext" value="" onblur="alert('x');">


How do you insert it? Do you simply use document.innerHTML to insert ist
or do you go the "long but better" way to create an new Node fist and
append that node to the parent Element?

> Is the problem that IE doesn't bind events for dynamically generated
> elements?


Never tried. So it may be possible.

> Is there a way make this happen?

Did you try to "bind" the event manually by setting

element.onblur = 'alert(x)';

?

Johannes
 
Reply With Quote
 
 
 
 
Richard Cornford
Guest
Posts: n/a
 
      04-20-2009
On Apr 20, 2:06*pm, Harlan Messinger wrote:
> I'm using Javascript to insert an HTML element like
>
> <input type="text" name="mytext" id="mytext" value="" onblur="alert('x');">


That may be an HTML element but just how are you creating/inserting it
with javascript (given that you have a number of choices there)?

> In both IE7 and Firefox 3, the input field appears, and I can type
> into it, but when I tab out of it to the next field, the alert
> only happens in Firefox.
>
> Is the problem that IE doesn't bind events for dynamically
> generated elements?


That may depend on what you mean by "bind events" (or by "bind" and
"events"). Generally IE is fine with event listeners on dynamically
created elements (so long as you go about setting then
'correctly' (where 'correctly' does not refer to any single
approach)).

> Is there a way make this happen?


Probably.

Richard.
 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      04-20-2009
Harlan Messinger wrote:
> I'm using Javascript to insert an HTML element like
>
> <input type="text" name="mytext" id="mytext" value="" onblur="alert('x');">
>
> In both IE7 and Firefox 3, the input field appears, and I can type into
> it, but when I tab out of it to the next field, the alert only happens
> in Firefox.
>
> Is the problem that IE doesn't bind events for dynamically generated
> elements? Is there a way make this happen?


*Dang Motzarella will not let me cross post! I hope my ISP sorts out
their news server soon!*

Here is a very stripped down example to get you started...

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta http-equiv="content-language" content="en-us">
<title>template</title>

<script type="text/javascript">
function insertField(){
var f=document.getElementById('daform');
var tb=document.createElement('input');
tb.setAttribute('name','mytext');
tb.setAttribute('id','mytext');

if( tb.addEventListener ) {
tb.addEventListener('blur',someFunc,false); //Proper
} else if( tb.attachEvent ) {
tb.attachEvent('onblur', someFunc); //IE only
}
else {
tb.onblur=someFunc; //old standby but does not append listeners
}
f.appendChild(tb);
}

function someFunc(){
alert("Im all set!");
}

// attach event after page loads
if( window.addEventListener ) {
window.addEventListener('load',insertField,false); //legacy
} else if( document.addEventListener ) {
document.addEventListener('load',insertField,false ); //proper
} else if( window.attachEvent ) {
window.attachEvent('onload', insertField); //IE only
}
</script>

</head>
<body>
<form id="daform">
<input type="text" name="sample" value="existing element">
</form>
</body>
</html>



--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
Harlan Messinger
Guest
Posts: n/a
 
      04-20-2009
Johannes Hafner wrote:
> Harlan Messinger schrieb:
>> I'm using Javascript to insert an HTML element like
>>
>> <input type="text" name="mytext" id="mytext" value=""
>> onblur="alert('x');">

>
> How do you insert it? Do you simply use document.innerHTML to insert ist
> or do you go the "long but better" way to create an new Node fist and
> append that node to the parent Element?
>
>> Is the problem that IE doesn't bind events for dynamically generated
>> elements?

>
> Never tried. So it may be possible.
>
>> Is there a way make this happen?

> Did you try to "bind" the event manually by setting
>
> element.onblur = 'alert(x)';
>
> ?
>
> Johannes

 
Reply With Quote
 
Harlan Messinger
Guest
Posts: n/a
 
      04-20-2009
Johannes Hafner wrote:
> Harlan Messinger schrieb:
>> I'm using Javascript to insert an HTML element like
>>
>> <input type="text" name="mytext" id="mytext" value=""
>> onblur="alert('x');">

>
> How do you insert it? Do you simply use document.innerHTML to insert ist
> or do you go the "long but better" way to create an new Node fist and
> append that node to the parent Element?
>
>> Is the problem that IE doesn't bind events for dynamically generated
>> elements?

>
> Never tried. So it may be possible.
>
>> Is there a way make this happen?

> Did you try to "bind" the event manually by setting
>
> element.onblur = 'alert(x)';


I'm using element.setAttribute("onblur", "alert('x')") .
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Events on dynamically generated elements in IE Harlan Messinger Javascript 21 04-22-2009 12:26 AM
dynamically adding controls with events (but events are not firing) SevDer ASP .Net 2 11-13-2007 06:33 AM
Differentiate between user caused events and script generated events jmpinchot@gmail.com Javascript 1 04-27-2007 03:05 AM
Acessing dynamically generated form elements.. sam Javascript 1 04-05-2006 09:31 PM
Events Events Events Please Help Chris ASP .Net Web Controls 0 08-30-2005 08:21 PM



Advertisments