Message afterAdd in new dialog jqGrid (navGrid)

Question

Hi I have this navGrid definition in Add action.

Grid.id >> $("#<%=Me.Id & "_" %>lstPreciosSUD")

{ width: 350, resize: false, closeAfterAdd: false, recreateForm: true,
    clearAfterAdd:false, viewPagerButtons: true, afterComplete: estadoReplicado,
    ,afterSubmit: function(response) { 
                if (response.responseText == "OK") {

                    alert("we are inside");

                    var myInfo = '<div class="ui-state-highlight ui-corner-all">' +
                        '<span class="ui-icon ui-icon-info" ' +
                        'style="float: left; margin-right: .3em;"></span>' +
                        '<span>Registro insertado correctamente!</span></div>',
                    $infoTr,
                    $infoTd;
                    $infoTr = $("#TblGrid" + "<%=Me.Id & "_" %>lstPreciosSUD" + ">tbody>tr.tinfo");
                    $infoTd = $infoTr.children("td.topinfo");
                    $infoTd.html(myInfo);
                    $infoTr.show();

                    setTimeout(function () {
                        $infoTd.children("div")
                            .fadeOut("slow", function () {
                                  $infoTr.hide();
                            });
                    }, 6000);

                        //alert("Registro creado.");
                        return [true,''];
                } 
                else { 
                        return [false, "Error creando precio de suplemento!"];
                } 
            },
    beforeSubmit: function(postdata){ 
        if ((postdata.tpb_importe == "") || (postdata.fini == "") || (postdata.ffin=="")) {
            return[false,"Importe y fechas es obligatorio!"]; 
        } else { return [true,""] }
    }
}}

In the second or date's inputs if are empty this return (return [false,"Importe y fechas es obligatorio!"] ") returns me a red message in the dialog from beforeSubmit like this http://i.imgbox.com/ackwIZvQ.jpg

I have to use closeAfterAdd:false and clearAfterAdd:false in this case, but i want to know and i have think use afterSubmit to show a green (for example) message if its all OK with a little function to do this, but if i use the above afterSubmit function, and its OK, don't show any message like error message, is possible to show any OK message? If there is an error, it shows it in red color I can't see in background how it add the new record, but in the dialog don't show any message.

Thanks.

Answer 1

If I understand you correct you will find an example of such implementation in the answer (see the demo). It shows how to use add your custom text in the same way like the standard error message will be added. In the demo I used errorTextFormat only to simulate the loading. You should move the code which show successful message in afterSubmit.

UPDATED: The code of afterSubmit could look about as (I don't tested the code)

afterSubmit: function (jqXHR) {
    var myInfo = '<div class="ui-state-highlight ui-corner-all">' +
            '<span class="ui-icon ui-icon-info" ' +
            'style="float: left; margin-right: .3em;"></span>' +
            '<span>The row is successfully added</span></div>',
        $infoTr,
        $infoTd;

    if (jqXHR.responseText !== "OK") {
        return [false, jqXHR.responseText];
    }

    $infoTr = $("#TblGrid_" + $.jgrid.jqID(this.id) + ">tbody>tr.tinfo"),
    $infoTd = $infoTr.children("td.topinfo");
    $infoTd.html(myInfo);
    $infoTr.show();

    // hide the info after 3 sec timeout
    setTimeout(function () {
        $infoTd.children("div")
            .fadeOut("slow", function () {
                // Animation complete.
                  $infoTr.hide();
            });
    }, 3000);
}