javascript - jqGrid display own error dialog with celledit - Stack Overflow

admin管理员组

文章数量:1336632

I'm using jqGrid for displaying tables in my PHP application. This all works fine but for one grid I want to make one specific column (called 'price') inline editable.

What I want is that, I want to issue my own Jquery-UI dialog screen when something is not okay. I think the best to do this is in the afterSubmitCell event but the problem is I can't prevent jqGrid from displaying the default dialog with the server response message.

I'm having something like this:

        $('#productslist').jqGrid('setGridParam', {
        afterSubmitCell : function(serverresponse, rowid, cellname, value, iRow, iCol){
            $('<div></div>').html('My own error message').dialog({ 
                'title' : 'Some title',
                'modal' : true,
                'show' : 'blind',
                'hide' : 'blind'
            });

            return [false, ''];
        }
    }).trigger('reloadGrid');

Accoding to the documentation: .php?id=wiki:cell_editing

This event has to return a array with a boolean indicating it's a succes or it isn't and as second the message. This message will be displayed in a jquery-ui dialog fired by jqGrid itself.

The thing is I want to customize the dialog when something wrong happends. But it seems there aren't a lot of possibilities for that or I can't find them.

I tried the event errorCell as wel, but that event is only fired when the server doesn't give a 200 response. Or should I send a other reponse code as 200 when a error happends? Seems to be a little dirty to me..

Hope someone can help me! Thanks in advance.

I'm using jqGrid for displaying tables in my PHP application. This all works fine but for one grid I want to make one specific column (called 'price') inline editable.

What I want is that, I want to issue my own Jquery-UI dialog screen when something is not okay. I think the best to do this is in the afterSubmitCell event but the problem is I can't prevent jqGrid from displaying the default dialog with the server response message.

I'm having something like this:

        $('#productslist').jqGrid('setGridParam', {
        afterSubmitCell : function(serverresponse, rowid, cellname, value, iRow, iCol){
            $('<div></div>').html('My own error message').dialog({ 
                'title' : 'Some title',
                'modal' : true,
                'show' : 'blind',
                'hide' : 'blind'
            });

            return [false, ''];
        }
    }).trigger('reloadGrid');

Accoding to the documentation: http://www.trirand./jqgridwiki/doku.php?id=wiki:cell_editing

This event has to return a array with a boolean indicating it's a succes or it isn't and as second the message. This message will be displayed in a jquery-ui dialog fired by jqGrid itself.

The thing is I want to customize the dialog when something wrong happends. But it seems there aren't a lot of possibilities for that or I can't find them.

I tried the event errorCell as wel, but that event is only fired when the server doesn't give a 200 response. Or should I send a other reponse code as 200 when a error happends? Seems to be a little dirty to me..

Hope someone can help me! Thanks in advance.

• javascript
• jquery
• jquery-ui
• jqgrid
• dialog

Share Improve this question Follow asked Aug 29, 2011 at 21:53 Kees SchepersKees Schepers 2,25811 gold badge2020 silver badges3131 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 2

I found a way to suppress the in-built dialog without having to modify the source code, which is obviously a last resort for maintenance reasons. When the in-built dialog pops up, it gets the focus, allowing us to use this event to close it down again

//Supresss jqGrid error dialog, called #info_dialog
$(document).on("focus", "#info_dialog", function () {

    $("#info_dialog").hide();

});

Or, if like me, the only problem was the styling and you are happy to pass the jqGrid message directly through to your dialog, you can do the below and not put anything in :

//Supresss jqGrid error dialog, called #info_dialog
$(document).on("focus", "#info_dialog", function () {

    var errorMessage = $("#infocnt").text();
    $("#info_dialog").hide();
    var $dialog = $('<div></div>')
        .html(errorMessage)
        .dialog({
            autoOpen: true,
            resizable: false,
            buttons: { "Done": function () { $(this).dialog("close"); } },
            title: 'Error'
        });

    $dialog.dialog('open');

});

I know this is an old post, but probably best way to handle this, without invading code is by redefining the function on your own code:

jQuery.jgrid.info_dialog = function(arguments)
{
     // implement your own notification
     showMessage("error");
};

The best practice in my opinion is to use always an error HTTP code (code >= 400) in case of any error. In the case you can use errorCell event.

If you can't change the server code you can modify the jqGrid code and change the lines

} else {
    $.jgrid.info_dialog($.jgrid.errors.errcap,ret[1],$.jgrid.edit.bClose);
    $($t).jqGrid("restoreCell",iRow,iCol);
}

to the following

} else {
    if ($.isFunction($t.p.errorCell)) {
        $t.p.errorCell.call($t, result, stat);
    } else if (ret[1]) {
        $.jgrid.info_dialog($.jgrid.errors.errcap,ret[1],$.jgrid.edit.bClose);
    }
    $($t).jqGrid("restoreCell",iRow,iCol);
}

You can do such changes in the jquery.jqGrid.src.js (go to the line 8665 in the version 4.1.2).

you can do something like this

$("#info_dialog").visible(false);

return [false, ""];

Now the default message will not be desplayed. You can popup whatever you want by your custom code.

本文标签： javascriptjqGrid display own error dialog with celleditStack Overflow