The creation of new DOM elements with MooTools is elementary, as is calling asynchronous JavaScript requests, Ajax. Here we combine the two for a very reusable recipe where the results of a form submission are displayed on the same page as the request. Hook the Ajax call up to your server-side script and make form magic. To avoid the necessity of server-side scripting, we call our own HTML markup and display that in this example.
<form action="javascript:" method="get"> <input type="button" id="mybutton" value="Ajax and Response!" onclick="ajax_it();"/> </form> <span id="put_it_here">Waiting for form submission...</span> <script type="text/javascript"> // A // make a new ajax request var myJax = new Request({ // A1 url: '?', // A2 onSuccess: function(response) { // if the ajax is called twice, empty the div $('put_it_here').empty(); // B // make a new DOM element var myDiv = new Element('div...