jqgrid loadError not firing

Question

I'm using free-jqgrid v 4.15.5., MVC 5, in-line editing, Firefox and Chrome.

My issue today is that I need to implement server side validation. This will be very great to have if the validation message displays nicely. I've cut and pasted some solutions from earlier questions. My issue is that the loadError override in my jqgrid is not firing. I'd love to leave it out altogether because I understand that loadError comes with jqgrid and should work by itself. Seems not to be firing with my loadError in or if I leave it out?

I must have something bad in my jqgrid or possibly some javascript code I did not post is interfering with correct operation. Possibly the HandleJsonException attribute filter isn't quite working as expected? Any thoughts?

I use this filter and decorated my JSON method saveGrid with it:

    public class HandleJsonExceptionAttribute : System.Web.Mvc.ActionFilterAttribute
    {
        public override void OnActionExecuted(ActionExecutedContext filterContext)
        {
            if (filterContext.HttpContext.Request.IsAjaxRequest() && filterContext.Exception != null)
            {
                filterContext.HttpContext.Response.StatusCode =
                    (int)System.Net.HttpStatusCode.InternalServerError;

                var exInfo = new List<ExceptionInformation>();
                for (Exception ex = filterContext.Exception; ex != null; ex = ex.InnerException)
                {
                    PropertyInfo propertyInfo = ex.GetType().GetProperty("ErrorCode");
                    exInfo.Add(new ExceptionInformation()
                    {
                        Message = ex.Message,
                        Source = "Validation",
                        StackTrace = ""
                    });
                }
                filterContext.Result = new JsonResult() { Data = exInfo };
                filterContext.ExceptionHandled = true;
            }
        }
    }

I triggered the above code with this in my saveGrid controller:

throw new HttpException(400, messagetext);

my jqgrid:

      $("#jqGrid").jqGrid({
            url: '/ajax/doSearch?viewid=&rowid=&isChild=false',
            mtype: 'POST',
            autowidth :true, 
            datatype: 'json',
            guiStyle: "bootstrap",
            editable: true,
            afterShowForm: function () {
                    alert('Please select row');
                    return;
                },
            editurl: "/Ajax/saveGrid?subGridViewId=&parentID=",
            loadonce: true,
            cmTemplate: { autoResizable: true },
            autoresizeOnLoad: true,
            autoResizing: { compact: false, resetWidthOrg: true },
            shrinktofit: true,
            colModel: ColModel1,
            loadError: function (jqXHR, textStatus, errorThrown) {
                alert('hi');
                // remove error div if exist
                $('#' + this.id + '_err').remove();
                // insert div with the error description before the grid
                myGrid.closest('div.ui-jqgrid').before(
                    '<div id="' + this.id + '_err" style="max-width:' + this.style.width +
                    ';"><div class="ui-state-error ui-corner-all" style="padding:0.7em;float:left;"><span class="ui-icon ui-icon-alert" style="float:left; margin-right: .3em;"></span><span style="clear:left">' +
                    decodeErrorMessage(jqXHR, textStatus, errorThrown) + '</span></div><div style="clear:left"/></div>')
            },
            loadComplete: function () {
                alert('load complete');
                // remove error div if exist
                $('#' + this.id + '_err').remove();
            },
            caption: label,
            height: "auto",
            postData: {
                viewid: GlobalViewid,
                __RequestVerificationToken: __RequestVerificationToken
            },
            rowNum: 50,
            rowList: [16, 50, 100],
            subGrid: showSubGrid,
            // javascript function that will take care of showing the child grid
            subGridRowExpanded: showChildGrid,
            subGridOptions: {
                // expand all rows on load
                expandOnLoad: false

            },
            actionsNavOptions: {
                printicon: "glyphicon-print",
                printtitle: "Print form",
                custom: [
                    {
                        action: "print", onClick: function (options) {
                          //  window.open('Report/ReportViewer?reportname=reportf_' + GlobalViewid + '&rowid=' + options.rowid + '&reporttype=form' , 'windowName', 'width=1000, height=700, left=24, top=24, scrollbars, resizable'); 
                            window.open('Report/ReportViewer?reportname=reportf_' + GlobalViewid + '&rowid=' + options.rowid + '&reporttype=form'); 

                        },
                        hidden: noPrintButton,
                    }
                ]
            },
            pager: "#jqGridPager"
            //toppager: true
        });

The problem:

loadError never triggers so my error message is the ugly popup:

Here is the response header (noting that is 500, not the 400 I was expecting)

HTTP/1.1 500 Internal Server Error Cache-Control: no-cache, no-store Pragma: no-cache Content-Type: application/json; charset=utf-8 Expires: -1 Server: Microsoft-IIS/10.0 X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNcVXNlclxzb3VyY2VccmVwb3NcYXBwQnVpbGRlcldpdGhSZXBvcnRzXGFzcG5ldDQtc2FtcGxlMVxBamF4XHNhdmVHcmlk?= X-Powered-By: ASP.NET Date: Sun, 02 Sep 2018 08:50:48 GMT Content-Length: 59

And here is the response: [{"Message":"hello","Source":"Validation","StackTrace":""}]

I tried changing the HandleJsonException attribute filter so it now returns status HTTP 400, but that didn't help.

filterContext.HttpContext.Response.StatusCode = (int)System.Net.HttpStatusCode.BadRequest;

What shall I do? Thanks.