SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,107
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)

    closures I think..

    Hi,

    I think my question is about closures, but i'm not 100% sure.
    I have a function within an object, and within it I want to override another function of the same object.
    Code javascript:
    var Ajax = {
    ...
      updatePanel: function(panel, file) {
        Ajax.request('Text', file);
        Core.emptyElement(panel);
        Ajax.showLoading(panel);
        Ajax.displayResponse = function() {
          Core.emptyElement(panel);
          // Don't copy Ajax.response yet - it hasn't been set.  When it has been, 
          // displayResponse will be called and then copy it across.
          panel.innerHTML = Ajax.response;
          Ajax.fadeIn(panel);
        };
      },
    ...
    }

    So displayResponse is another function of Ajax, if updatePanel is called I want the displayResponse function to replace an element with the variable Ajax.response.

    The problem is that panel.innerHTML is set to Ajax.response set when updatePanel is called, And not when displayResponse is called.

    I hope that makes some sense,


    Thanks,

  2. #2
    SitePoint Wizard silver trophy kyberfabrikken's Avatar
    Join Date
    Jun 2004
    Location
    Copenhagen, Denmark
    Posts
    6,157
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Why do you think, that displayResponse is called immediately? Most likely, there is a flaw in the logic, which invokes displayResponse.

  3. #3
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,107
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Hello,

    I don't doubt there's a problem with the logic, I wrote it

    Here's the live example if you'd be able to take a look,
    http://www.yellowshoe.com.au/example...ass_test2.html

    I'm trying to package the request / response in one function updatePanel.

    Here's an example of what it should look like,
    http://www.yellowshoe.com.au/example...lass_test.html


    Thanks,

  4. #4
    SitePoint Wizard silver trophy kyberfabrikken's Avatar
    Join Date
    Jun 2004
    Location
    Copenhagen, Denmark
    Posts
    6,157
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    First of all, Ajax.xhr is false. I looks like your init function is never called. Running Ajax.init(); fixes this. Secondly, the following code makes no sense:
    Code:
    Ajax.displayResponse = function() {
      Core.emptyElement(panel);
      function(panel) {
        panel.innerHTML = Ajax.response;
      }
      Ajax.fadeIn(panel);
    }
    Change it to:
    Code:
    Ajax.displayResponse = function() {
      Core.emptyElement(panel);
      panel.innerHTML = Ajax.response;
      Ajax.fadeIn(panel);
    }
    In the first case, you're declaring an anonymous function, but never assigning it to anywhere, and never calling it.

  5. #5
    SitePoint Guru
    Join Date
    Mar 2004
    Location
    Earth
    Posts
    406
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You want multiple instances of Ajax that don't interfere with each other?

    Remember how we talked about object-orientation ..?

  6. #6
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,107
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Hey brothercake,

    Where abouts am I setting up multiple instances of Ajax?
    Yes, I remember our talk and I found it very insightful.

    I'm wanting the updatePanel() function to empty the panel element, display a loading indicator, make a request, and overwrite the displayResponse() function - so that it, when called will remove the loading indicator, update the panel with response and fade in.

    I only intended one Ajax object to be created and used. Remember, i'm beginning in all of this

  7. #7
    SitePoint Guru
    Join Date
    Mar 2004
    Location
    Earth
    Posts
    406
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You're not, I misunderstood what you wanted and drew the wrong conclusion Let me have another read of your question...

  8. #8
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,107
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    I misunderstood what you wanted
    That's very understandable, I'm near incomprehensible a lot of the time but I try hard.

  9. #9
    SitePoint Guru
    Join Date
    Mar 2004
    Location
    Earth
    Posts
    406
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Not sure I really understand - you want panel.innerHTML to be Ajax.response in one situation, and something else in another? In which case, you could pass Ajax.response as an argument to display response:

    Code JavaScript:
    Ajax.displayResponse = function(html) {
        ...  
        panel.innerHTML = html;
        ...
        };
    And then pass something else in the different situation.

    Is that it?

  10. #10
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,107
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    hmm, can you believe it was a silly mistake

    kyberfabrikken, you were correct - But I did actually try that first, it's just I broke something else at the same time.

    It was the same problem that I had in the last thread would you believe - using 'this' within an event handler

    Note to self:
    Use this for Object Oriented methods - when you need multiple instances of the object.
    Use the objects name when there's only one and you won't run into problems.

    Thanks for your help you two. My function's really growing on me -
    It makes Ajax, a one liner. - And it even looks all 2.0 and stuff
    Code javascript:
    Ajax.updatePanel(panel, 'documents/ajax_text.html');

    This is probably the most common Ajax feature - A partial update of the page with the response sent back from the server. Is there anything wrong with it?

  11. #11
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,107
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    One more thing,

    I'm just testing this out in IE7
    http://www.yellowshoe.com.au/example...ass_test2.html

    The first time it works for me, then when I refresh the page, it's showing the old, (what I wanted overriden) displayResponse function. You have to restart the browser to fix the issue.

    Any clues to this odd behaviour? Can anyone confirm this is a problem in IE6?

    The first time it works for me, then when I refresh the page, it's showing the old, (what I wanted overriden) displayResponse function. You have to restart the browser to fix the issue.

    Any clues to this odd behaviour? Can anyone confirm this is a problem in IE6?
    Last edited by markbrown4; Aug 15, 2007 at 03:10.

  12. #12
    SitePoint Wizard silver trophy kyberfabrikken's Avatar
    Join Date
    Jun 2004
    Location
    Copenhagen, Denmark
    Posts
    6,157
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by markbrown4 View Post
    The first time it works for me, then when I refresh the page, it's showing the old, (what I wanted overriden) displayResponse function. You have to restart the browser to fix the issue.
    I'm not sure, what you mean by "showing the old displayResponse function"?

    Quote Originally Posted by markbrown4 View Post
    Can anyone confirm this is a problem in IE6?
    It doesn't work in IE6. Instead of loading the content via XHR, the Javascript fails, and the browser just navigates to the link.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •