Problem with "Multiselection without CTRL" and getting selected rows

[Jürgen]

Hello

My code is based on this thread:
http://www.telerik.com/forums/multiple-row-selection-without-holding-ctrl-key

I have a grid:

01.@(Html.Kendo().Grid(Model.globalConfigData.Countries)
02.      .Name("CountryFilter")
03.      .Columns(columns =>
04.               {
05.                   columns.Bound(p => p.value).Width(100).Title("Wert").HtmlAttributes(new { Name = "Value" });
06.                   columns.Bound(p => p.id).Width(30).Title("Id").Hidden().HtmlAttributes(new { Name = "Id" });
07.               })
08.      .Scrollable()
09.              .Selectable(selectable => selectable.Enabled(false))
12.      .DataSource(dataSource => dataSource
13.          .Server()
14.          .Model(model => model.Id(p => p.id)))
15.)

With the custom-multiselect configured:

1.$(document).ready(function ()
2.{
3.    // Enables multiselect on the grid without holding CTRL
4.    $("#CountryFilter").delegate('tbody>tr', 'click', function ()
5.    {
6.        $(this).toggleClass('k-state-selected');
7.    });
8.});

And then a function which is fired by a button:

01.function onClick_FilterButton(e)
02.{
03.    var counter = 0;
04.    var ctySelected = [];
05.
06.    var entityGrid = $("#CountryFilter").data("kendoGrid");
07.    var rows = entityGrid.select();
08.
09.    rows.each(function (index, row)
10.    {
11.        ctySelected[counter] = row.cells[1].innerText;
12.        counter++;
13.    });
14.
15.    $.ajax({
16.        type: "POST",
17.        url: "/Event/FilterButton",
18.        datatype: "json",
19.        traditional: true,
20.        data: { "ids": ctySelected }
21.    });
22.}

Now to my problem:
When I use the normal selection mode of the Kendo-Grid (selectable.Mode(GridSelectionMode.Multiple)), the onClick-function works fine, but when I activate the custom multiselect-mode, the function crashes at line 7 (entityGrid.select() => value is Null or undefined)

How can I get the selected rows when I use this functionality?

A second (not urgent) question:

1.ctySelected[counter] = row.cells[1].innerText;

Is it possible to get the cell by it's name, like:

1.ctySelected[counter] = row.cells["MyValue"].innerText;

Kind regards
Jürgen

[Dimiter Madjarov]

Hello Jurgen,


When the selectable option of the Grid is set to false, the select method cannot be used. You could retrieve the selected rows via the k-state-selected class that is set to them.
E.g.

$("#Grid tbody .k-state-selected")

Regarding the second question, you could retrieve the column index by the property name, which is set as data-field attribute to the column header.
E.g.

$("#Grid thead th[data-field='ShipCountry']").index()

Then you could use this index to retrieve the specific cell and it's text on any Grid row.

I hope this information helps.

Regards,
Dimiter Madjarov
Telerik

 

 

[Jürgen]

Thanks, worked like expected