DOM Update not firing JavaScript 1

[1DMF]

Hi,

Perhaps this is just the way it is, but I was hoping it wasn't.

I use AJAX to get new content and display it to the browser using the innerHTML method.

However if I include javascript in the content, it doesn't seem to get fired, is there a way round this?

thanks,
1DMF

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!

 

[BillyRayPreachersSon]

It really depends on your AJAX code.

For example, with jQuery there are many different AJAX calls you can use, some of them will eval scripts by default, some will strip scripts by default, and others will do whatever action your settings tell it to.

So, if you're hand-rolling, try using 'eval' on the script (you'll need to use a regex to extract this... not too hard, especially if you pilfer the code from jQuery or Prototype, etc).

If you're using one of the aforementioned libraries, I'd read up on the docs, as it should be in there somewhere.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[1DMF]

hmmm, I'm not sure you understood the question, or i'm not understanding the answer.

If you update the body part of the DOM via innerHTML and it contains...

<p>Some Text</p><script>alert("Hello")</script>

That should fire as soon as the DOM is updated shouldn't it? but it doesn't

or is this more the way JS is handled via a page load rather than it just being in the body section instead of the head? I thought all DOM updates are parsed and actioned in realtime, it seems javascript isn't.

But I decided that the function which is called after the HTML is returned from the AJAX call is where I can add additional functionality.

I guess it's my fault for choosing to use AJAX instead of frames as I've been asked to re-write our members area.

with frames it's simple, call the server side script using the bottom frame as the target, then print the resulting HTML which included any JS which needs to fire.

Using AJAX isn't so simple and I'm going to have to be smarter to achieve some of what I currently do with frames.

It's going to make the re-write harder and more time consuming as it means some code needs to be re-writen rather than revamped with the new template, but hey, keeps me out of mischief I supose!

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!

 

[1DMF]

I did another test to confirm this, in the returning HTML I put the following

<script>function testit(){alert("test");}</script>

then the function which is called after the AJAX returns I tried to call testit(); but got that 'Object Expected' error.

Which means the browser doesn't see the new content with the included javascript function.

Is there a way round this?

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!

 

[1DMF]

another thing I have found, <style> tags don't work either.

Or am i doing something stupid, wouldn't be the first time

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!

 

[IPGuru]

whyat you are trying will never work, you cannot insert Javascript into a document after it has loaded & have it execute, I would suggest you ammend your programming logic to somthing along these lines

 object.innerHTML="some new html"
 alert ('html inserted')

any function you want to exicute after the page has changes will need to be included in the original javascript file.

 

[1DMF]

yeah that's what i was thinking, i'm suprised style tags don't work either, though inline styles do.

oh well, like i originally thought, just the way it is!

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!

 

[BillyRayPreachersSon]

I said it once, and i'll say it again using less words:

Use regex to parse out the script, and then use eval to execute it.



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[1DMF]

Why didn't you say so in the first place

I get ya Dan, I just wondered why the browser wasn't re-evaluating the DOM update itself.

It seems to apply CSS inline on the new content, but ignores style tags and any scripts, I just wondered if I was doing something wrong or......

I said it before and i'll say it again... it's just the way it is. ;-)

If i have to strip it out of the returned HTML I might as well just include the script in the original source either as a separate function or within the function which is called after the AJAX returns.

Incidently how big is too big when it comes to JS source files?

I assume it is client machine relative, the better the PC the more JS it can handle or is it browser specific?



"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!

 

[BillyRayPreachersSon]

I've never really done any tests to see how large a JS file can go, but I can't imagine it will be too small a limit.

The only advice I will give is: Don't 'minify' your JS by stripping out all CR/LFs... it's hard to debug, and I've known it slow IE browsers down on occasion (although I have no test-case that proves this, so I'll probably get flamed for saying so!).



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[1DMF]

Hey Dan,

Yeah, hear ya, I don't think i'll have a problem, i'm only @ 949 lines in one script currently and that includes all comments and formatting.

I gestimate the final size to be double that by the time i've written the entire AJAX application.

It runs beautifully at the moment and I just wondered if anyone had actually hit a wall at some point from experience.

Last thing you want it to spend weeks developing and then hit some limit or have your extranet users with lesser computers moaning about it being slow.

I remember spending months writing an advernture game on the BBC model B , then one day got an 'out of memory' error when trying to define another array! I was gutted and never did finish the program. Though we are talikng 25+ years ago and it did only have 32k of memory -

I just thought i'd pop the question before I got too carried away.

I won't be obfuscating the code, to my mind that's bad coding practices, any interpreter should fold the code pre-execution anyway, as it does with perl, and managing two versions of a file can lead you into problems of its own.

What i'll do is carry on as is, if I actually get a problem, i'll let everyone know!

Cheers
1DMF.

"In complete darkness we are all the same, only our knowledge and wisdom separates us, don't let your eyes deceive you."

"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!