How to cancel destroy action in JS

4 posts, 0 answers
  1. Maciej
    Maciej avatar
    7 posts
    Member since:
    May 2017

    Posted 13 Apr Link to this post

    I'm calling options.error() in my destroy function but the row is removed anyway. How to prevent that ?

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <title>Untitled</title>
     
     
    <body>
      <div class='grid'><div>
        <script>
          $(".grid").kendoGrid({
            editable:
            {
              mode: "inline",
              confirmation: false
            },
            dataSource:
            {
              transport:
              {
                read: options =>
                {
                  options.success([{test: "test", id: 1}]);
                },
                destroy: options =>{
                  options.error("error")
                }
              },
              schema:
              {
                model:
                {
                  id: "id"
                }
              }
            },
            columns:
            [{
              field: "test"
            },
             {
               command: ["destroy"]
             }]
          })
        </script>
    </body>
    </html>
  2.
  3. Stefan
    Admin
    Stefan avatar
    2056 posts

    Posted 17 Apr Link to this post

    Hello, Maciej,

    Thank you for the code.

    This is expected because there are may be different reasons for why the delete is not possible. For example, if the item does not longer exist in the database because it was removed from somewhere else.

    Once the error is returned, the error function of the dataSource will be called and the developer has full control over how to handle this on the client side:

    https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/events/error

    In this case, we can suggest making a new read to retrieve the correct items from the server:

    https://dojo.telerik.com/ETuyEveh

    Also, the requests can be prevented during the requestStart event:

    https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/events/requeststart

    I hope this is helpful.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Maciej
    Maciej avatar
    7 posts
    Member since:
    May 2017

    Posted 17 Apr Link to this post

    I tried 'requestStart' event. I called preventDefault() but the row was deleted anyways.
  7. Stefan
    Admin
    Stefan avatar
    2056 posts

    Posted 18 Apr Link to this post

    Hello, Maciej,

    Preventing the default behavior will stop the request to be made to the server, but it will still remove the row from the UI.

    Currently, once the delete button is clicked, the row will be removed from the DOM, and the in order to show it again the Grid has to be refreshed(read to the server).

    I can suggest submitting a feature request for an option to prevent removing of the row on the remove event, and based on its popularity we may implement it in a future release:

    https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/events/remove

    http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-beta-feedback?category_id=170280

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  8.
Back to Top