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

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • wendallsan
    New Member
    • Sep 2006
    • 5

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

    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):


    [CODE=javascript]var Default_county_ init_data = Class.create({
    initialize: function(name){
    this.name = name;

    this.consumable s = new Ajax.Request('h ttp://www.stage.emd.w a.gov/dev/get_csv.php?cou nty=' + this.name + '&cat=consumabl es',
    {method: 'get', onSuccess: function(e){
    return eval(e.response Text);
    }
    });

    . . .

    }
    }
    [/CODE]
    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.consumabl es = ' 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.consumable s = eval(e.response Text);

    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:

    [CODE=javascript]new Ajax.Request.bi nd(this, 'http://www.stage.emd.w a.gov/dev/get_csv.php?cou nty=' + this.name + '&cat=consumabl es',
    {method: 'get', onSuccess: function(e){
    this.consumable s = eval(e.response Text);
    });
    [/CODE]
    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:



    thanks!
    Last edited by gits; Apr 11 '08, 06:50 AM. Reason: added code tags
  • gits
    Recognized Expert Moderator Expert
    • May 2007
    • 5390

    #2
    hi ...

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

    [CODE=javascript]// store a reference to 'this' context of your object
    var me = this;

    var cb = function(e){
    // clusure the reference here
    me.consumables = eval(e.response Text);
    };

    new Ajax.Request('h ttp://www.stage.emd.w a.gov/dev/get_csv.php?cou nty=' + this.name + '&cat=consumabl es', {method: 'get', onSuccess: cb});[/CODE]
    kind regards

    Comment

    • wendallsan
      New Member
      • Sep 2006
      • 5

      #3
      ok, I can make things work with this I think, thanks!

      Comment

      • gits
        Recognized Expert Moderator Expert
        • May 2007
        • 5390

        #4
        post back in case you have problems with it ...

        kind regards

        Comment

        Working...