1. Home
  2. Forum
  3. JavaScript - EJ 2
  4. actionFailure is empty and Editor dialog close

actionFailure is empty and Editor dialog close

Two quick questions:

When doing a CRUD operation, if the data fails server side validation, we have it returning a 409 error.  This works and triggers actionFailure.  The issue is the passed error array is always empty regardless of what we try to return.  How does the error message need to be sent from the server?

This is our actionFailure function:

function actionFailure(e){
    showToast("An error has occurred","danger");
    grid.refresh();
    console.log(JSON.stringify(e));
    $(".e-dlg-container.e-dlg-center-center").remove();
}

This is our server response:

{"status":"error","message":"Title is a required field."}

This is what the actionFailure function outputs to console:

{"error":[{"error":{}}],"name":"actionFailure"}

As you can see in the function, we are using jQuery to remove the Editor modal.  Is there a better way of doing this?

9 Replies
BS Balaji Sekar Syncfusion Team February 20, 2020 12:11 PM UTC

Hi Mark, 
 
Greetings from Syncfusion  forum. 
 
We have validated and your below quires at our end. 
 
Query 1: How does the error message need to be sent from the server ? 
 
Yes, we can sent error message from server using exception. Here we have sent error message when value as null in insert method. Please refer to the below code. 
 
public IActionResult Insert([FromBody]CRUDModel<Orders> value) 
        { 
            if (value != null) 
            { 
                order.Insert(0, value.Value); 
                return Json(value.Value); 
            } 
            else {  
                throw new Exception("Insert required value"); 
            } 
        } 
 
actionFailure: function (e) { 
                . . . .  
                var errorMsg = e.error[0].error.responseText.split("Exception:")[1].split("</div>")[0]; 
                alert(errorMsg); // error message sent from server side 
                console.log(JSON.stringify(e)); 
               . . .  
            } 
 
Query 2: As you can see in the function, we are using jQuery to remove the Editor modal.  Is there a better way of doing this? 
 
From your code, you want to remove Editor modal in actionFailure even. By default we an option as closeEdit property to remove editModel  from grid. please refer the below code snippet. 
 
actionFailure: function (e) { 
. . .  . 
                setTimeout(function () { 
                    grid.closeEdit() // you can close dialogObj 
                }, 100); 
            } 
 
 
Please get back to us, if you need any further assistance. 
 
Regards, 
Balaji Sekar. 


MA Mark February 20, 2020 03:37 PM UTC

Thank you for the quick response!  I completely missed that in the API docs for closing the editor.  

Regarding the exception, I should have clarified that I am using a remote datasource with the UrlAdaptor.  The server exception is what triggers the JSON error response with the HTTP status code of 409.  Does the remote server need to send it differently? 

Thanks!

BS Balaji Sekar Syncfusion Team February 21, 2020 06:35 AM UTC

Hi Mark, 
 
Thanks for your update. 
 
By default,  DB throws the default exception errors from server side and it can be retrieved our side using actionFailure event in client end. For your case we have used try and catch to handle error exceptions. Here you can decide to send default or custom exception message to specific exception from server side. 
 
Please refer to the below code snippet. 
 
public IActionResult Insert([FromBody]CRUDModel<Orders> value) 
        { 
            try 
            { 
                { 
                     . . . . . . .  
                     . . . . .  . .   
                } 
            } 
            catch (Exception e) 
            { 
                // you can difereniate corresponding to message. 
                if (e.Message == "Object reference not set to an instance of an object.") { // we can compare with required status code (ex: 409) error message and decide exception message. 
                    throw new Exception(e.Message);  // throw the exception and you can get the error message in “ActionFailue” event 
                } 
                else 
                { 
                    throw new Exception("Custom exception"); // // throw the custom exception and you can get the error message in “ActionFailue” event 
                } 
            } 
        } 
 
If you still facing the issue please share your requirement briefly and share your corresponding code. 
 
Please get back to us, if you need any further assistance. 
 
Regards, 
Balaji Sekar. 


MA Mark February 21, 2020 05:28 PM UTC

Thank you for responding - it may just be that I am not understanding how throwing an exception on the server makes it way to the client when the server is set to only respond with JSON and HTTP status codes.  There are 2 different servers - 1 for the REST endpoint and the other for serving content.

Here is the server side code which is Laravel 6.x (PHP) that is our REST API:

$validator = $this->validatePort(
    request()->input('value.name'),
    request()->input('value.number'),
    request()->input('value.description'),
    request()->input('value.location')
);
if($validator->fails()){
    return response()->json($validator->getMessageBag()->getMessages(),409);
}

And here is our client side code:

var dataManager = new ej.data.DataManager({
    url: 'HOSTNAME/api/ports',
    crudUrl: 'HOSTNAME/api/portsCrud',
    adaptor: new ej.data.UrlAdaptor(),
    crossDomain: true,
    headers: [{"Authorization": "Bearer *******"}]
});

var grid = new ej.grids.Grid({
    dataSource:dataManager,    
    actionFailure: actionFailure,.......
function actionFailure(e){
    showToast("An error has occurred","danger");
    grid.refresh();
    console.log(JSON.stringify(e));
    grid.closeEdit();
}


The server responds with this JSON object with an HTTP status code of 409:

{
"number": [
"The number must be 4."
]
}

The actionFailure console only outputs the following (the dataManager is parsing the response, but its empty):

POST HOSTNAME/api/portsCrud 409 (Conflict)
{"error":[{"error":{}}],"name":"actionFailure"}


I presume that the JSON failure message needs to be formatted in a specific way.  Is that true?

TS Thiyagu Subramani Syncfusion Team February 24, 2020 01:25 PM UTC

Hi Mark, 

Thanks for your update. 

For your requirement we have prepared a sample and throwed exception inserting(adding) new row data in grid. Please refer to the below sample. 

By default, our actionFailure event returns the exception details with responseUrl , statusText , status code etc like below image. 


 


Query : I presume that the JSON failure message needs to be formatted in a specific way.  Is that true? 
 
Yes, our actionFailure event returns the error details in JSON format. Like below image. 

 
 
 
 
 
 
Please get back to us, if you need any further assistance. 
 
Regards, 
Thiyagu S 


MA Mark February 24, 2020 07:38 PM UTC

I think we are getting closer, but it still doesn't work.  I just want to clarify, our endpoint ONLY returns JSON.  So if there was an error, then endpoint will return JSON containing the error details.  Will the actionFailure and the dataamanager work with this or must it have a standard HTTP server response?

TS Thiyagu Subramani Syncfusion Team February 25, 2020 05:54 AM UTC

Hi Mark,  
 
Thanks for your update. 
 
Yes,  what exception (e) need to send from server side, it will comes with an standard http server response and fetched error details in actionFailure event with JSON formatted way in client side. 
 
Please get back to us, if you need any further assistance. 
 
Regards, 
Thiyagu S 
  


MA Mark February 25, 2020 06:57 AM UTC

We have been chasing our tails forever.  It wasn't going to console due to a circular reference error.  We can return a JSON response as we had been, we just had to iterate deep enough into the returned array to not cause a circular error.  We have it working now exactly as we need.  Thank you so much for your patience and demos, they helped to keep us going!


TS Thiyagu Subramani Syncfusion Team February 25, 2020 10:14 AM UTC

Hi Mark, 
 
Thanks for your update. 
 
We are happy to hear that you have achieved your requirement. Please get back to us if you need further assistance. 
 
Regards, 
Thiyagu S 


Loader.
Up arrow icon