getting mootools to run after ajax returns true?

unwashed potato! · 8 Oct 2008 at 00:49

is there a simple way to get a mootools effect to run only after ajax returns true.

at the moment mootools seems to be giving ajax a problem in that it randomly will stop ajax running, sometimes until refresh, sometimes just once twice, sometimes never and i'm hoping this will fix the problem if it's do able?

thanks

also (although this is far less priority atm) i tried using the fx.slide effect to hide the element clicked which can be in a vertical list of other elements. although the element was hidden the margin wasn't removed so as each element was hidden the gap between each became bigger and bigger. i tried using morph to do this, which it does though only if it's the first element otherwise same problem, it's far uglier as it kind of jumps to the side. i also used javascript to remove the margin but then it jumps the element up 10px then slides it away so again looks ugly.

any fix for this?

Augmented · 8 Oct 2008 at 23:44

Mammalian said:
is there a simple way to get a mootools effect to run only after ajax returns true.

Yes. There are a number of standard XHR events you can attach callback functions to.

Assuming you're using 1.2:

Code:

new Request({
    method: 'get',
    url: '/someurl',
    data: { 
     some : data
    }
})[COLOR="Yellow"].addEvents({
    'onRequest': function() {
      alert('request started!);
    },
    'onComplete': function(response) {
      alert('request succeeded! response was '+response);
    },
    'onFailure': function() {
      alert('boo! request failed!);
    }
})[/COLOR].send();

unwashed potato! · 13 Oct 2008 at 16:27

Augmented said:
Yes. There are a number of standard XHR events you can attach callback functions to.

been looking at how this works last couple of days and i seem to understand it now though need a bit of help with it.

is there an easy way to say on return true/on return false? atm i know if the request was successful so the morph effect takes place but this is no good as the ajax could have returned false but the user will think it returned true as the effect is shown. how do i deal with this?

unwashed potato! · 19 Oct 2008 at 15:55

any one able to help with this? it's stopping me continuing many areas as they'd all potentially have the same problem so wont be continuing to use the old method i used.

Augmented · 19 Oct 2008 at 19:13

What are you calling? A local php script, a webservice? What response does the serverside call return when it completes the operation? Without knowing this, there's no way to know how to handle it.

Normally there are a couple of ways to handle different responses from your server-side calls.

HTTP Response Codes
Usable/parsable messages in the reponse

Ideally you should use these both in combination. Every server-side call you make should return some kind of response to you e.g. a json string

Code:

{
  "Data":{"UpdatedId" : 123456},
  "Error":null,
  "Success":true
}

along with a status code. For success, you expect an HTTP code in the 200-300 range. This will cause the onComplete event to fire. So in your onComplete() event, you can do some checking on the returned response and decide how to handle it:

Code:

'onComplete': function(response) {
  if (response.Success === true) {
   // Do your successful action
   alert('Item #' + response.Data.UpdatedId + 'was updated!');
  } else {
   // Do your failure action
  },

The onFailure event will fire if you return an error HTTP code from your server-side function; that is anything above 300 like a 403, 500 or a 404.