This is a migrated thread and some comments may be shown as answers.

Accessing Selected Rows within a page

3 Answers 67 Views
Grid
This is a migrated thread and some comments may be shown as answers.
chesk345
Top achievements
Rank 1
Iron
Iron
Iron
chesk345 asked on 06 Oct 2017, 12:21 PM

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>

3 Answers, 1 is accepted

Sort by
0
chesk345
Top achievements
Rank 1
Iron
Iron
Iron
answered on 06 Oct 2017, 12:46 PM
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.
0
chesk345
Top achievements
Rank 1
Iron
Iron
Iron
answered on 06 Oct 2017, 02:44 PM

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

0
Stefan
Telerik team
answered on 10 Oct 2017, 08:28 AM
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.
Tags
Grid
Asked by
chesk345
Top achievements
Rank 1
Iron
Iron
Iron
Answers by
chesk345
Top achievements
Rank 1
Iron
Iron
Iron
Stefan
Telerik team
Share this question
or