[MooTools] Een form versturen met AJAX

[_eXistenZ_]

Op het moment ben ik helemaal into mootools omdat ik zelf natuurlijk nooit zo mooi een AJAX / effecten script kan maken als mootools.
Ik wil echter niet de standaard functie gebruiken om een ajax class aan te roepen, zoals in de handleiding aangeboden wordt, omdat ik dan voor elke form die anders heet een functie moet schrijven.

Zo heb ik de standaard AJAX functie

JavaScript:

$('start').addEvent('click', function(e) {
    e = new Event(e).stop();
 
    var url = "http://demos.mootools.net/demos/Ajax/lipsum.html";
 
    /**
     * The simple way for an Ajax request, use onRequest/onComplete/onFailure
     * to do add your own Ajax depended code.
     */
    new Ajax(url, {
        method: 'get',
        update: $('log')
    }).request();
});

al teruggebracht tot

JavaScript:

    function getPage(url) {
            new Ajax(url, {method: 'get', update: $('main') }).request();
    }

Dit wil ik ook doen om een form te versturen, maar op de een of andere manier krijg ik deze niet voor elkaar. Atm kom ik niet veel verder dan wat expirimenteren met

JavaScript:

    function submitForm(url) {
            new Ajax(url, {method: 'get', update: $('main') }).request();
    }

maar als ik de mootools docs pak zie ik niet hoe ik dit zo kan aanpassen dattie voor de page te retrieven, ook nog de inhoud van het form verstuurd via GET of POST.

Wie raad weet, graag.

[SchizoDuckie]

http://docs.mootools.net/Element/Element-Form.js (zie het example onderaan)

[_eXistenZ_]

Mja maar wat voor zin heeft mijn heel class dan? als ik het met 1 regeltje afkan?

[ Voor 24% gewijzigd door _eXistenZ_ op 01-06-2007 17:18 ]

[SchizoDuckie]

_eXistenZ_ schreef op vrijdag 01 juni 2007 @ 17:17:
Mja maar wat voor zin heeft mijn heel class dan? als ik het met 1 regeltje afkan?

Dat vroeg ik me inderdaad ook af

Verder kan je deze functionaliteit natuurlijk ook gewoon standaard toevoegen aan alle forms met een bepaalde classname d.m.v. de $$().each()

[ Voor 23% gewijzigd door SchizoDuckie op 01-06-2007 17:31 ]

[_eXistenZ_]

Ok nice maar ik zal alsnog iets moeten om aan te geven in welke div ik wil outputten, dus dan moet ik alsnog een stukkie gebruiken van wat ik al had staan toch?

[_eXistenZ_]

Weet iemand hoe de code zou moeten zijn om dit voor elkaar te krijgen?

Niet dat ik lui ben ofzo en er zelf geen tijd in wil steken maar
- het werkt dan wel en belangrijker:
- ik kan dan door die code leren hoe het wel zou moeten, en beter mootools begrijpen.

[remcotolsma]

Je kunt zodra je een Ajax object aanmaakt in de options ook data meegeven. In de documentatie van MooTools staat het volgende:

data you can write parameters here. Can be a querystring, an object or a Form element.

JavaScript:

var myAjax = new Ajax(url, {method: 'get', data: $('id_van_formulier'), update: $('main')}).request();

Je zou dan bijvoorbeeld in elk formulier in het target attribute de id van het ouput element plaatsen.

JavaScript:

$ES('form').each(function(form) {
  var url = form.getProperty('action');
  var outputElement = form.getProperty('target');

  // add on submit event
    var myAjax = new Ajax(url, {method: 'get', data: form, update: outputElement}).request();
});