简体   繁体   中英

Default row selection for dataTable primeNG

How could I select automatically a row in dataTable after a given record? The dataTable has sorted column, and pagination. After a given record I would expect the record to be selected on the page that exists.

The dataTable has a property(an array) called [(selection)] , to add/remove/preselect rows you can just add/remove values from your array

to pre-select the nth :

component:

 ngOnInit() {
   this.data = [/*data*/];           
   this.selectedItems = [ this.data[n-1]];
 }

template:

<p-dataTable [value]="data" [(selection)]="selectedItems">

Demo

The following will help.

In the HTML part add this attribute to the datatable

 [(selectedRow)] = "rowIWantToGetSelected"

In the component just populate this "rowIWantToGetSelected" with the item from the array. eg This is for first row

this.rowIWantToGetSelected = recordsArray[0]

IMPORTANT : Ng prime expects a property named rowId with the row number (starting index 0). If your model doesn't have it, Add that property to it and update it with the row number. If you don't have this property, it won't select the expected row. Following is the example of selecting the first row.

this.rowIWantToGetSelected = { 
  ...recordsArray[0],
  rowId : 0
}
  

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM