0
votes

How to submit dojo form using AJAX and if there are errors, print errors near incorrectly filled fields? Now I am doing something like that:

dojo.ready(function() {
    var form = dojo.byId("user_profile_form");
    dojo.connect(form, "onsubmit", function(event){
    dojo.stopEvent(event);

    var xhrArgs = {
        form: form,
        handleAs: "json",
        load: function(responseText){
            var result_data = zen.json.getResult(responseText);
            dojo.byId("response").innerHTML = "Form posted.";
        },
        error: function(error){
            // We'll 404 in the demo, but that's okay.  We don't have a 'postIt' service on the
            // docs server.
            dojo.byId("response").innerHTML = "Form posted.";
        }
    }
    // Call the asynchronous xhrPost
    dojo.byId("response").innerHTML = "Form being sent..."
    var deferred = dojo.xhrPost(xhrArgs);
});

But I don't know how to print errors

1

1 Answers

1
votes

There are a few ways that you can do this. The one that I prefer is to subscribe to the IO Pipeline Topics

For errors, subscribe to the /dojo/io/error topic. Here's an example that will Growl the errors.

dojo.subscribe("/dojo/io/error", function(/*dojo.Deferred*/ dfd, /*Object*/ error){
    // Triggered whenever an IO request has errored.
    // It passes the error and the dojo.Deferred
    // for the request with the topic.

    var responseTextObject = dojo.fromJson(error.responseText)
    var growlMessage = '';

    if (responseTextObject && responseTextObject.message) {
        growlMessage += responseTextObject.message
    } else {
        // Don't Growl the xhr cancelled messages.
        if (error.message == 'xhr cancelled') {
            return;
        }

        growlMessage = error.message
    }

    new ext.Growl({
        message: growlMessage
    });
});

The server should provide all the error details in the response. In this example, a JSON formatted response is expected but if it's not provided, the error is still shown.

If you want to see the nice invalid field styling, put the widgets in a dijit.form.Form