Question

I’d like to replace my_div‘s content after user clicks the submit button with the output that comes from my.php. I want to achieve this using mootools javascript library. How can I do this?

<div id="my_div">
<form name="myform" action="http://www.domain.com/my.php" method="POST">
<br><br>
<input type="text" size="25" value="Enter your name here!">
<br><input type="submit" value="Send me your name!">
</div>

Thanks for reading.

Answer 1

You should give the submit button an id, I chose ‘fsubmit’ in this example. And ‘f’ is the id of the form.

$('fsubmit').addEvent('click', function(e) {
    e = new Event(e).stop();

    var url = $('f').get('action');

    var request = new Request({
        url: url,
        method: 'get',
        onComplete: function(response) {
            $('my_div').set('html', response);
        }
    });

    request.send();
});

Or you could use a shortcut:
http://mootools.net/docs/core/Request/Request.HTML