Delete Muliple Rows having Checkbox and using common Delete Button

[monsoon]

Could any one help me how to delete muliple Rows in grid each having checkboxes and by clicking common delete button will delete the selected rows.Clicking on rows apart from checkbox  should not make look like as  selected /enabledor in different colour.
I am using only Kendo UI  web and Framework .. So  my code is like

MyTemplate:
$("#rfgGrid").kendoGrid(
{  
dataSource : DataSource,
editable : true, 
height : 260,
columns : [
{
field : "select",
title : "Select",
width : "16%",
template: "<input type='checkbox' class='checkbox' />"
},
{
field : "name",
title : "Name",
width : "35%"
}] 
});

My Java Script:

$('#rfgGrid input:checked.checkbox').each(function(){
 var dataItem1= grid.dataItem($(this).closest('tr'));
grid.dataSource.remove(dataItem1);
}

By this only one row is got deleted even if I select many in the check box..

could any one guide me or help me wit code on http://jsfiddle.net or http://jsbin.com..

Regards,
Winds

[Kiril Nikolov]

Hi Winds,

You can find all the checked inputs and remove the row that they reside on like this:

$("#grid").find("input:checked").each(function(){
            grid.removeRow($(this).closest('tr'));
          })

I have created a JSBin with this implementation, showing how to delete multiple rows based on a checkbox:

http://jsbin.com/ijugav/8/edit
 
Regards,
Kiril Nikolov
Telerik

[monsoon]

Thank you very much for your timely help Kiril.. But I end up with multiple confirmation alert for each row Instead I need only one alert prompt altogether.Can you please help me ...my editable is "editable:"true inline"thanks in Advance,

[monsoon]

Thank you Kiril. But I end up with multiple confirmation alert for each row Instead I need only one alert prompt altogether.Can you please help me . I use "editable:"true inline"

[Kiril Nikolov]

Hello Winds,

You can use editable.confirmation configuration property to prevent the confirmation dialogs. Please keep in mind that at the moment it is not possible to delete multiple rows and show only one confirmation window. The DataSource remove() and the Grid removeRow() methods take only one argument, therefore it is not possible to limit the number of confirmations.

I have modified the JSBin to show the new implementation.

Regards,
Kiril Nikolov
Telerik

[monsoon]

Thank you very much for your timily help  Kiril..I accomplish the requirement through my  custom coding..like by making confiramtion:false in editable and using HTML confirm();.Thank you

[Razack]

This only removes from current pages. But I need to remove from multiple pages at a time. So I tried with 
grid.dataSource.data().remove(item); 
It is working for few items. If selected records are big(say 70 records), it makes hanging problem. See my code blelow

function callOnDelete(gridName, arrayName) {
var grid = $('#' + gridName).data('kendoGrid');
var data = grid.dataSource.data();

//No of records to be deleted
var arrayLength = Object.keys(arrayName).length;

for (var i = 0; i < data.length; i++) {
var dataItem = data[i];

if (dataItem.hasOwnProperty('uid')) {
if (arrayName[dataItem['uid']]) {
data.remove(dataItem);
arrayLength = arrayLength - 1;
if (arrayLength <= 0) break;
}
}
}
}

[Kiril Nikolov]

Hi Razack,

As your question differs from the original topic, would you mind opening a separate support request with more detailed information on the issue that you are facing and a runnable sample of what you have tried so far and we will be happy to help!

Thank you in advance for your cooperation.

Regards,
Kiril Nikolov
Telerik

 

 

[Rajeev]

In my case it deletes only the first row

[Kiril Nikolov]

Hello Rajeev,

 

Please open a separate support request with a runnable sample and we will be happy to help you.

 

Regards,
Kiril Nikolov
Telerik

 

 

[MOTASH]

is still not possible to delete multiple rows with single confirmation(as a batch operation),i'm using kendo 2018.1.117

[Viktor Tachev]

Hello,

Please submit each new query in a separate thread. This way the information in a given thread will be consistent and easier to use as reference. 

With that said, in order to delete multiple records in the Grid programmatically you can use the following approach.

• enable Batch editing mode for the Grid
• call removeRow for each of the rows in the Grid that should be deleted
• call sync method for the DataSource so the changes are persisted to the server.

An alternative approach would be to call DataSource remove method for each item that should be deleted. After this call sync() again to submit request to the server. 


Regards,
Viktor Tachev
Progress Telerik