Deleted item is not substituted in a paged grid with OData v4

8 posts, 0 answers
  1. Frank
    Frank avatar
    5 posts
    Member since:
    Aug 2010

    Posted 04 Sep 2018 Link to this post

    Hello,

    when using inline-edit in a grid with a datasource calling an OData v4 service, the deleted item is not substituted in the current page (see screen in attachment). What am I missing in my code?

    Following an example

    $('#gridProductCategories').kendoGrid({
        sortable: true,
        scrollable: false,
        selectable: true,
        pageable: {
            refresh: true,
            pageSizes: [5, 10, 20, 40],
            buttonCount: 5
        },
        toolbar: [{ name: "create", text: getLocValue("AddProductCategory") }],
        editable: {
            mode: "inline",
            confirmation: getLocValue("Confirmation")
        },
        columns: [
            {
                field: "PC_ID",
                title: getLocValue("ID")
            },
            {
                field: "PC_Text_de",
                title: getLocValue("Text_de")
            },
            {
                field: "PC_Text_en",
                title: getLocValue("Text_en")
            },
             {
                 width: 90,
                 command: [
                     { name: "edit", text: { edit: "", cancel: "", update: "" }, className: "action_button edit" },
                     { name: "destroy", text: "", className: "action_button delete" }
                 ],
                 title: " "
             }
        ]
    });
    [HttpDelete]
    [EnableQuery(AllowedQueryOptions = AllowedQueryOptions.All)]
    [Authorize(Roles = "administrator, maintenance")]
    public IHttpActionResult Delete([FromODataUri] int key)
    {
        ProductCategory productCategory = dbcontext.ProductCategory.Find(key);
        if (productCategory == null)
        {
            return BadRequest(ModelState);
        }
     
        productCategory.PC_Deleted = true;
     
        dbcontext.ProductCategory.AddOrUpdate(productCategory);
        dbcontext.SaveChanges();
        return Ok(productCategory);
    }
    productCategorySource: new kendo.data.DataSource({
        type: "odata-v4",
        pageSize: 20,
        serverPaging: true,
        serverFiltering: true,
        serverSorting: true,
        transport: {
            read: {
                url: serviceUrl + "/odata/ProductCategories",
                dataType: "json",
                type: "GET"
            },
            update: {
                url: serviceUrl + "/odata/ProductCategories(0)",
                dataType: "json",
                type: "PUT"
            },
            create: {
                url: serviceUrl + "/odata/ProductCategories",
                dataType: "json",
                type: "POST"
            },
            destroy: {
                url: function (data) {
                    return serviceUrl + "/odata/ProductCategories(" + data.PC_ID + ")"
                },
                dataType: "json",
                type: "DELETE"
            }
        },
        schema: {
            model: {
                id: "PC_ID",
                fields: {
                    PC_ID: { type: "number", editable: false },
                    PC_Text_de: { type: "string", validation: { required: true } },
                    PC_Text_en: { type: "string", validation: { required: true } }
                }
            }
        },
        error: function (e) {
            console.log(e.errorThrown);
        }
    })
  2. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    1081 posts

    Posted 06 Sep 2018 Link to this post

    Hi, Frank,

    Thank you very much for the provided screenshot and code.

    The behaviour that you are describing in the pager of the Kendo UI Grid could be due to a failed destroy request.

    Could you verify if the destroys are successful by inspecting the response/ debugging the server logic and/or by using the refresh on the pager? 
    Would you also share the read action in the controller?

    Look forward to hearing back from you.

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Frank
    Frank avatar
    5 posts
    Member since:
    Aug 2010

    Posted 19 Sep 2018 Link to this post

    Hello Alex,

    thanks for your answer, the item is just deleted fine in the controller and the response looks also fine. After refreshing the page everything is as it should be.

    Antwort HTTP/1.1 200 OK
    Cache-Control no-cache
    Content-Length 176
    Content-Type application/json; odata.metadata=minimal
    Date Wed, 19 Sep 2018 15:32:13 GMT
    Expires -1
    OData-Version 4.0
    Persistent-Auth true
    Pragma no-cache
    Server Microsoft-IIS/8.0
    X-AspNet-Version 4.0.30319
    X-Powered-By ASP.NET

     

    The read function is just standard odata implementation

    [EnableQuery(AllowedQueryOptions = AllowedQueryOptions.All)]
    public IQueryable<ProductCategory> Get()
    {
         return dbcontext.ProductCategory.Where(e => !e.PC_Deleted);
    }

     

  4. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    1081 posts

    Posted 21 Sep 2018 Link to this post

    Hi, Frank,

    The only thing that seems different than the usual response, is the status code. 

    Would you be able to check if at all possible to respond with JSON and the deleted item instead?

    If this does not help, would you be able to send us project or give me as much information as possible so I can attempt to reproduce this error?

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  5. Frank
    Frank avatar
    5 posts
    Member since:
    Aug 2010

    Posted 24 Sep 2018 Link to this post

    Hello Alex,

    thanks again. I´ve sent you only the response header, the status code 200 comes from using the Ok-method to return the deleted item in the delete method (see the posted one), so the deleted item is returned as JSON.

    I attached a small demo project in which the problem occurrs.

    Kind regards

    Frank

  6. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    1081 posts

    Posted 26 Sep 2018 Link to this post

    Hi, Frank,

    Thank you so much for the provided project that perfectly illustrates your point.

    I can see the described behaviour which occur when server operations are used. I would need a little extra time to investigate if we can ensure the pager is refreshed in this occasion, meanwhile, you may add a requestEnd event handler and force a read:

    requestEnd: function (e) {
        if (e.type === "destroy") {
            var grid = $('#gridProductCategories').data("kendoGrid");
            grid.dataSource.read();
        }               
    }

    Thank you in advance for your understanding.

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  7. Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    1081 posts

    Posted 28 Sep 2018 Link to this post

    Hello, Frank,

    Thank you very much for your patience.

    After having discussed this with the team, with server operations enabled, it is not possible to have a different behaviour unless another read request is made. 

    If we were to change the way the Kendo UI Grid works now, that would be a breaking change for all users who do not wish the additional read request being made on creating and destroying items. 

    At this point, the option would be to issue another read request programmatically when an item is created or destroyed when the requestEnd event of the data source is triggered as demonstrated in my previous response.

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  8. Frank
    Frank avatar
    5 posts
    Member since:
    Aug 2010

    Posted 16 Oct 2018 Link to this post

    Hi Alex,

    thanks for your help, I´m fine with your workaround.

    Kind regards

    Frank

Back to Top