Select row by checking the checkbox in kendo ui grid module with typescript

Question

I am very new to Kendo UI and Angular2. I am using Kendo ui with Angular2. I have a Grid Module with checkbox in eachrow. I want to know the rowid or any field value on select of eachrow. How to do this in typescript. Below code is app.component.ts

import { Component } from '@angular/core';
import { products } from './products';

@Component({
    selector: 'my-app',
    template: `
        <kendo-grid [data]="gridData" [height]="410">
            <kendo-grid-column field="ProductID" title="ID" width="40">
            </kendo-grid-column>
            <kendo-grid-column field="ProductName" title="Name" width="250">
            </kendo-grid-column>
            <kendo-grid-column field="Category.CategoryName" title="Category">
            </kendo-grid-column>
            <kendo-grid-column field="UnitPrice" title="Price" width="80">
            </kendo-grid-column>
            <kendo-grid-column field="UnitsInStock" title="In stock" width="80">
            </kendo-grid-column>
            <kendo-grid-column field="Discontinued" title="Discontinued" width="120">
                <ng-template kendoGridCellTemplate let-dataItem>
                    <input type="checkbox" [checked]="dataItem.Discontinued" enabled/>
                </ng-template>
            </kendo-grid-column>
        </kendo-grid>
    `
})
export class AppComponent {
    private gridData: any[] = products;
}

Can anyone please help me how to achieve it using typescript .

Anyone here,who is working in Kendo UI and Angular2 ,Please help me — ananya
– ananya, Commented May 9, 2017 at 10:14

576prakash · Accepted Answer · 2017-06-22 14:13:17Z

first you have to wrote [selectable]="true" (selectionChange)="selectionChange($event)" must be true in below code

  <kendo-grid [data]="view" [selectable]="true" [pageSize]="pageSize" [scrollable]="'none'" [pageable]="true" (pageChange)="pageChange($event)" (click)="openRecdoc()" (selectionChange)="selectionChange($event)">                                       <kendo-grid-column field="Status" class="uk-text-center">
      <template kendoGridHeaderTemplate class="uk-text-left">                                              Status
      </template>
          </kendo-grid-column>
      </kendo-grid>


and then typescript:
Wrote like this this is  "event.index" for getting specific row index

     protected selectionChange(event: SelectionEvent): void {
            var Index = event.index;
            var inNo = this.view1[RecurringIndex];
            this.glbData.No = inNo .DocumentID;
    }

i thiks this is help for u thanks

Collectives™ on Stack Overflow

Select row by checking the checkbox in kendo ui grid module with typescript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related