FormBind allows you to quickly setup your “Web 1.0″ form for asynchronous submission. Basically it sets things up so that whenever the user hits the submit button, rather than submitting the form in the usual way, and refreshing the entire page, the contents are sent over xmlhttp (or any transport), and then the results are passed to the given callback.

How do you do it? Easy:

function magicForm() {

  var x = new dojo.io.FormBind({

    // reference your form

    formNode: document.forms[1],

	

    load: function(load, data, e) {

      // what to do when the form finishes

      // for example, populate a DIV:

      dojo.byId('myDiv').innerHTML = data;

    }

  });

}

	

dojo.addOnLoad(magicForm);

Note the unfortunate naming between dojo.io.bind() and dojo.io.FormBind.

dojo.io.bind() is a function that immediately sends the given info to the specified URL. (It would probably better be called something like dojo.io.send() but it isn't.)

dojo.io.FormBind(), on the other hand, doesn't send anything to the server. It just hooks up events so that when the user presses the submit button then the data is sent via dojo.io.bind(). Also note that you call "new" to make it work.

Note also that although dojo.io.bind() also takes a formNode argument, it's tricky to use and you are better off using FormBind. That's because for forms containing the Editor/Editor2 widgets, they need to serialize their data back to the [textarea] before the form is submitted, and that only happens when the form's onSumbit handler is called. Just calling dojo.io.bind() and specifying a formNode won't do that. However, with FormBind (and with an actual [input type="submit] button in in the form), everything works perfectly.