By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,509 Members | 1,301 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,509 IT Pros & Developers. It's quick & easy.

How would I put data from an AJAX call into a custom class instance (w/ Prototype)

P: 5
Hi All,

I've stumped myself writing an app that uses Prototype and a bit of PHP. Here is what I have:

I have a custom class named Default_county_init_data that, upon initialization makes several Ajax.Request calls to gather data from the server.

What I'm having trouble with is getting the data from the Ajax call back to the custom class instance. I basicially want to get a Javascript array from my PHP page and insert that into the custom class instance once the Ajax call is done.

Here is the most logical way I could think to do it (but it doesn't work):

Expand|Select|Wrap|Line Numbers
  1. var Default_county_init_data = Class.create({
  2. initialize: function(name){
  3. = name;
  5. this.consumables = new Ajax.Request('' + + '&cat=consumables',
  6. {method: 'get', onSuccess: function(e){
  7. return eval(e.responseText);
  8. }
  9. });
  11. . . .
  13. }
  14. }
The onSuccess handler of the Ajax.Request object evals the response text of the PHP file. I'm hoping it would return that to a property of the class instance (the 'this.consumables = ' bit before the Ajax call), but it doesn't seem to be doing that.

I've also tried setting the value within the onSuccess method-- something like:

this.consumables = eval(e.responseText);

This doesn't seem to work, either, and I'm unclear what 'this' really is at this point in the code (I don't think it's my custom class instance anymore).

Is this an issue with binding (which I've not figured out how to use yet)? I have the Bungee Book which discusses this, it looks like I would want something like this for my onSuccess function:

Expand|Select|Wrap|Line Numbers
  1. new Ajax.Request.bind(this, '' + + '&cat=consumables',
  2. {method: 'get', onSuccess: function(e){
  3. this.consumables = eval(e.responseText);
  4. });
But this doesn't seem to work, either . . . doing it this way, it seems that the onSuccess method never gets called!

I would greatly appreciate any suggestions, this app can be viewed at this URL:

Apr 10 '08 #1
Share this Question
Share on Google+
3 Replies

Expert Mod 5K+
P: 5,390
hi ...

its a problem with the scope ... the callback has its own execution context so you may just use:

Expand|Select|Wrap|Line Numbers
  1. // store a reference to 'this' context of your object
  2. var me = this;
  4. var cb = function(e){
  5.     // clusure the reference here
  6.     me.consumables = eval(e.responseText);
  7. };
  9. new Ajax.Request('' + + '&cat=consumables', {method: 'get', onSuccess: cb});
kind regards
Apr 11 '08 #2

P: 5
ok, I can make things work with this I think, thanks!
Apr 11 '08 #3

Expert Mod 5K+
P: 5,390
post back in case you have problems with it ...

kind regards
Apr 12 '08 #4

Post your reply

Sign in to post your reply or Sign up for a free account.