aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes Dynamic Javascript Functions Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Soft Skills this week in the Jobs Discussion forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "Dynamic Javascript Functions" Watch "Dynamic Javascript Functions" New topic
Author

Dynamic Javascript Functions

Scott McGhee
Greenhorn

Joined: Apr 10, 2007
Posts: 22
I have a page which is using AJAX to dynamically populate a div tag with DHTML from a servlet. The DHTML may contain javascript function definitions (which could be dynamically generated). Currently, the page is loading the HTML and displaying the forms correctly within the 'div' tag - but the buttons which call functions that are part of the dynamically created html retrieved by the AJAX call are not working. An error is thrown "Object expected".

I need some help with this. The way i see it, either

1) I am somehow improperly invoking the dynamic script functions

or

2) I can't invoke script functions returned by an AJAX call and then populated dynamically into a 'div' tag


Hopefully I am doing something wrong here (option 1 above) since it will probably be easy to fix.

Otherwise, I would have to pre-define all the javascript functions i want to use (which is not ideal, but doable).
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
You can not put JavaScript code onto the page with innerHTML after the oage loads. You need to use eval so the browser upates it. If you are using prototype, it has an property to evalulate the scripts (evalScripts <-- i think).
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61761
    
  67

Obviously it's possible, since Protoype does it. I believe it traverses the newly loaded DOM doing eval() on any scripts it finds.

At this point I use the Prototype Ajax classes (or classes that I've dervied from them) for all my Ajax needs. Life is too short to do all that low-level coding myself.


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Originally posted by Bear Bibeault:
Life is too short to do all that low-level coding myself.


Well you are too busy yelling at people here to roll you own.

Eric
Scott McGhee
Greenhorn

Joined: Apr 10, 2007
Posts: 22
Ok I was able to get the javascript to evaluate using Prototype; or more specifically 'String.evalScripts()'

For example if I were loading the following innerHTML into the div tag:

It would properly output 'Hello World' like I'd expect. This is all well and good.

However...
- - - - - - - - - - - - - - - - - - -
Here is the innerHTML loaded by AJAX...
This displays the button 'Hello World', but when you click the button it still gives me the 'Object expected' error!

NOTE: This is an example. I could have put 'alert("Hello World")' in the onclick for the button. But i really need to make a call to a function inside the HTML loaded by the AJAX request.

Any Ideas?? My guess here is that maybe there is another helpful utility function in Prototype (or some other suite) - or possibly i'm not using the method you suggested properly?

Here is the method which is invoked when the AJAX request onreadystatechange:


FYI: I REALLY appreciate all of your prompt and helpful responses! So far this has been a great help!
[ April 25, 2007: Message edited by: Scott McGhee ]
Scott McGhee
Greenhorn

Joined: Apr 10, 2007
Posts: 22
Hey guys,

Did a quick search online myself. Found the answer here: http://www.sergiopereira.com/articles/prototype.js.html

Thanks!

Here is the change to the HTML which will fix the issue...

[ April 25, 2007: Message edited by: Scott McGhee ]
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61761
    
  67

Thunder stolen!

Right, you have to use the function literal format.
 
 
subject: Dynamic Javascript Functions