Accessing Selected Rows within a page

4 posts, 0 answers
  1. chesk345
    chesk345 avatar
    5 posts
    Member since:
    Apr 2013

    Posted 06 Oct Link to this post

    Hello,

    What is a recommended approach to getting:

    1. The number of selected rows

    2. The sum of one of the data-bound column's values across the selected rows

    i.e., If the user selects two "Customer" rows, and the "Items Purchased" column in those rows have values 10 and 20, respectively, I need the display to be:

    Customers: 2   Items Purchased: 30

    If no rows are selected, then those displayed values would, of course, be 0.

    The way the Grid is marked up is shown below.  I did not create the application, but I am tasked with enhancing it as described and I don't want to bug the original developer and have them "do it for me".  The application is using jQuery, so I have access to that.  Thanks for your help.

    <div id="gridWrapp" class="k-content" >
        <div class="row">
            <div class="col-md-12 center">
                @(Html.Kendo().Grid<CustomerModel>()
                .Name("Grid")
                .Columns(columns =>
                {
                columns.Bound(p => p.ItemsPurchased).Width(35);
                ...
                })
            </div>
        </div>
    </div>
  2. chesk345
    chesk345 avatar
    5 posts
    Member since:
    Apr 2013

    Posted 06 Oct in reply to chesk345 Link to this post

    I may have jumped to gun  by posting here.  I have located a script that is already accessing the selected rows in this app, so I may have a good clue to start with.  I will come back to this thread to update you on what I found, and/or if I still have questions.
  3. chesk345
    chesk345 avatar
    5 posts
    Member since:
    Apr 2013

    Posted 06 Oct in reply to chesk345 Link to this post

    OK, I figured it out from your documentation (Thanks!)

     

    What I needed most was...
    EXAMPLE - GET THE SELECTED DATA ITEM(S) WHEN USING ROW SELECTION

    from the Grid's change event API documentation here:
    https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-change

  4. Stefan
    Admin
    Stefan avatar
    1145 posts

    Posted 10 Oct Link to this post

    Hello, Francis,

    I`m glad to hear that you have found the solution.

    Indeed, the change event and the select method are perfect when a result has to be dynamically changed based on the selection. Also, the dataItem method can be used in combination with the select method in order to retrieve the information for the selected rows:

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

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

    If additional assistance is needed for the task which is related to Kendo UI, we will gladly assist.

    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