Using jqgrid, what is the best way to return errors from server side validation when using inline editing?

Question

I am using jqgrid and using the inline editing mode and can't figure out how to return errors back to the client from server side validation rules

I use fluent validation on my serverside to validate before persisting to a database. This works great except I don't see how to return errors when editing in inline mode. If I don't persist the values to the databse, the client still shows the value which should be rejected.

What is the recommended way to return an error after someone commits an inline edit so you will get some popup on the client side showing the error and it will stay in edit state ?

---

NOTE: this image below is in response to Oleg's comment and answer below

Answer 1

The recommend way is to use any HTTP error code in the response on the submitting of wrong data and to return the error description in the body of the response. If you need some more specific action like displaying another dialog with the error information, setting of focus on a field, marking some fields with CSS class 'ui-state-error' or something like that you should use errorfunc callback function.

If restoreAfterError is false the inline editing will be continued.

UPDATED: I mention in comments that the server should produce the error message as the response. In case of ASP.NET MVC the default message is HTML text which you posted as the first picture. If you use HandleJsonExceptionAttribute which I described in my old answer the error message will be serialized as JSON, but it contains additional information which you don't need to display (like the StackTrace). So you should use errorfunc parameter of editRow or saveRow to decode the server response. You can either use decodeErrorMessage from the already referenced answer or use the $.parseJSON function directly:

errorfunc: function(rowid, res) {
    var errorText = $.parseJSON(res.responseText).Message;
    $.jgrid.info_dialog($.jgrid.errors.errcap,
        '<div class="ui-state-error">' + errorText + '</div>',
        $.jgrid.edit.bClose,
        {buttonalign: 'right'});
}