• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

Dynamic Javascript Functions

 
Greenhorn
Posts: 22
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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).
 
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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).
 
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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.
 
Eric Pascarello
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

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
Posts: 22
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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
Posts: 22
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Thunder stolen!

Right, you have to use the function literal format.
 
That's a very big dog. I think I want to go home now and hug this tiny ad:
a bit of art, as a gift, that will fit in a stocking
https://gardener-gift.com
reply
    Bookmark Topic Watch Topic
  • New Topic