Bulk delete of selected items

6 posts, 0 answers
  1. Jason
    Jason avatar
    1 posts
    Member since:
    Aug 2012

    Posted 17 Aug 2012 Link to this post

    I'm brand new to MVC and Kendo.  Is there a way to allow for the bulk delete of selected items from a grid.  I have the grid populating with items from the database.  I have a button control on the page that I'd like to be able to click and delete all the currently selected items from the grid.  Is this possible by either passing the list of items to the controller or somehow getting access to the selected items from the controller method?

    I understand the functionality exists to handle this on an item by item basis with a delete button in the row itself, but hoping there is a way to do this in bulk.

    Thanks,
    Jason
  2. Petur Subev
    Admin
    Petur Subev avatar
    1882 posts

    Posted 20 Aug 2012 Link to this post

    Hello Jason,

    Basically you can enable the so called batch editing functionality. This way all the records that you delete will be send to the server at once (in a batch). 
    If you want to select several rows and delete them with a click of a button then you can achieve this by combining the usage of the select method, the removeRow method of the Grid and the sync method of the dataSource.

    Let me know if further questions arise.

    Kind Regards,
    Petur Subev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kevin
    Kevin avatar
    30 posts
    Member since:
    Jul 2012

    Posted 22 Aug 2012 Link to this post

    This would be a really great demo for Telerik to provide as it is a very common scenario.  What do you think Petur?

  4. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2190 posts

    Posted 27 Aug 2012 Link to this post

    Hi Jason,


    We have prepared example project (please find attached) to demonstrate you batch editing, selecting multiple rows and deleting them. We have done this using select and removeRow methods of the Grid:

    1. Get currently selected rows with select method of the Grid
    2. Remove each of the selected rows by removeRow  method
    3. When you press the Save Changes button - send all changes to the server

    If more questions arise, please let us know.

    Kind Regards,
    Vladimir Iliev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. Jesse
    Jesse avatar
    24 posts
    Member since:
    Aug 2013

    Posted 31 Oct Link to this post

    I'm also new but have a follow up question on this. Could you simply get the IDs of the selected rows, make your own AJAX call to the server to delete them and then refresh the Grid after deleting? For example, if you were already using the grid in popup edit mode for create & update.
  6. Stefan
    Admin
    Stefan avatar
    1273 posts

    Posted 03 Nov Link to this post

    Hello, Jesse,

    The selected items Ids can be retrieved on the changed event of the Grid using the dataItem method. Then the Ids can be used to make an Ajax request, and in the success function, the read method of the dataSource can be called to refresh the Grid:

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

    https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-select

    https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-dataItem

    https://docs.telerik.com/kendo-ui/api/javascript/data/datasource#methods-read

    I made a Dojo demonstrating similar approach without the actual call to the server:

    https://dojo.telerik.com/UwUja

    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.
Back to Top