Problem with "Multiselection without CTRL" and getting selected rows

3 posts, 1 answers
  1. Jürgen
    Jürgen avatar
    7 posts
    Member since:
    May 2013

    Posted 25 Apr 2014 Link to this post

    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
  2. Answer
    Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2311 posts

    Posted 25 Apr 2014 Link to this post

    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
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. Jürgen
    Jürgen avatar
    7 posts
    Member since:
    May 2013

    Posted 29 Apr 2014 in reply to Dimiter Madjarov Link to this post

    Thanks, worked like expected
Back to Top