Mootools 1.11 and 1.2.4 conflict, Ajax.Form

Question

I'm trying to use Mootools Ajax.Form, and was able to make a successful test installation with this: http://demos111.mootools.net/Ajax.Form

ONLY if I downgraded my mootools script to 1.11. For the rest of the stuff on my site, I've been using 1.2.4.

I'm guessing there's a conflict issue going on...but wasn't sure how to fix this? I did some searching for the Ajax.Form to see if anyone else had this problem, but so far have been unsuccessful.

Any help would be much appreciated. Thank you!

possible duplicate of [Newsletter Signup Form using Mootools, no page reload](http://stackoverflow.com/questions/5085429/newsletter-signup-form-using-mootools-no-page-reload) — Dimitar Christoff, Feb 26 '11 at 16:56
Should not have started a new question when you asked the same earlier. Also, why are you looking at mootools 1.11 demos when you have 1.2.x? Read the docs on the API changes? Anyway, check the original thread or @gonchuku's answer here, although this should be closed and merged with your original question, imo. — Dimitar Christoff, Feb 26 '11 at 16:59

score 1 · Accepted Answer · answered Feb 25 '11 at 15:21

The difference is that the Element.send shortcut changed it's signature between 1.11 and 1.2.x
The new signature no longer accepts the request options as part of the .send method, only a URL is accepted (to allow overriding the URL to GET/POST to on each request).

With the new API, you have to use the set method on the form element to set the send options like this:

document.id('myForm').set({
  send: {
    onRequest: function() { /* do something here */ },
    onComplete: function() { /* do something else */ }
  }
});

you can see a full example on how to use the Element.send method on the following fiddle: http://jsfiddle.net/S3H4G/2/

You can refer to the official docs to see the current Element.send signature, and the Request object docs to see all the available options you can pass in the set method. Do notice that in case of forms, the url, method and data parameters default to what the form element currently has set in the HTML.

+1 and also, this question is a repost / dupe and should be closed - http://stackoverflow.com/questions/5085429/newsletter-signup-form-using-mootools-no-page-reload — Dimitar Christoff, Feb 26 '11 at 16:54

score 0 · Answer 2 · answered Feb 23 '11 at 19:28

0

Unfortunately the newer versions of Mootools are not backward compatible. But it is usually pretty easy to update older plugins. If this Ajax.Form is pretty simple it could just be a matter of reassigning the $ method.

Check out the Plugins section of this article for help:

http://mootools.net/blog/2009/06/22/the-dollar-safe-mode/

answered Feb 23 '11 at 19:28

nickles80

1,101
8
10

I just replaced all the "$" with "document.id" but with no change. Could it be something else? – Jay Feb 23 '11 at 22:15
I found this: https://github.com/mootools/mootools-upgrade-helper#readme. But it doesn't tell me HOW to debug using firebug. And the "included" is pretty vague too - is that just linking all the files via ? Or is there some other kind of installation hoop I should jump? – Jay Feb 23 '11 at 23:04
Without knowing more specifics it is hard to help you out with this. I did do some research and it looks like the default mootools Request object does not handle form requests any longer: http://mootools.net/docs/core/Request/Request http://mootools.net/docs/more/Forms/Form.Request You might be better off just finding a new ajax form submission example to build off of. – nickles80 Feb 24 '11 at 18:23

Mootools 1.11 and 1.2.4 conflict, Ajax.Form

2 Answers2