Table RowGroup

UI Components for Angular
Post Reply
promodel
Posts: 1
Joined: 20 Mar 2017, 15:07

19 Dec 2018, 21:01

Hey all,

So I have a requirement that says I should have the ability to select a row within a what would be Known as Row Grouping. For reference I'm referring to the ability within the p-table component to group data into sub rows.

The Problem:
When selecting a single item from an expanded RowGroup the entire grouping of data is highlighted (indicating more than one visual row is selected).
Should this behavior be expected? As when the selection of an expanded data section is done there appears to only be one item selected through two-way data binding.

Background:
- Assume, the data being passed is sorted by the dataKey required.
- Assume, rowGroupMetaData is an object as it's described in the example (https://www.primefaces.org/primeng/#/table/rowgroup).
- Assume, getCellData is simply a function that parses the columns inputs into a user displayable format.

I have the following HTML

Code: Select all

<p-table #table [autoLayout]="autoLayout" [columns]="selectedColumns" [dataKey]="dataKey" [exportFilename]="exportFileName"
    [paginator]="showPaginator" [(selection)]="selectedItem" [selectionMode]="selectionMode" [rows]="rowsPerPage"
    [value]="filteredData">
    
    ...

<!-- begin: row table layout -->
    <ng-template>
        <ng-template pTemplate="body" let-rowData let-rowIndex="rowIndex" let-expanded="expanded" let-columns="columns">
            <tr class="ui-widget-header" *ngIf="rowGroupMetaData[rowData[dataKey]].index === rowIndex">
                <td [attr.colspan]="columns.length">
                    <a href="#" [pRowToggler]="rowData">
                        <i [ngClass]="expanded ? 'fa fa-fw fa-chevron-circle-down' : 'fa fa-fw fa-chevron-circle-right'"></i>
                        <span>{{rowData[dataKey]}}</span>
                        <span class="badge badge-info ml-2">{{ rowGroupMetaData[rowData[dataKey]].size
                            }}</span>
                    </a>
                </td>
            </tr>
        </ng-template>
        
        <!-- begin: possibly the offending bit --> 
        <ng-template pTemplate="rowexpansion" let-subRow let-index="rowIndex">
            <tr [pSelectableRow]="subRow" [pSelectableRowIndex]="index">
        <!-- end: possibly the offending bit --> 
        
                <td *ngFor="let col of columns" [ngSwitch]="col.type">
                   <!-- begin: implementation detail. IGNORE. -->
                    <div *ngSwitchCase="gridColumnTypes.Boolean" class="text-center">
                        <i *ngIf="getCellData(subRow, col)" class="fa fa-check" aria-hidden="true"></i>
                    </div>
                    <div *ngSwitchCase="gridColumnTypes.Date">
                        {{ getCellData(subRow, col.field) | dodDate }}
                    </div>
                    <div *ngSwitchCase="gridColumnTypes.DateTime">
                        {{ getCellData(subRow, col.field) | dodDateTime }}
                    </div>
                    <div *ngSwitchCase="gridColumnTypes.Number" class="text-center">
                        {{ getCellData(subRow, col.field) }}
                    </div>
                    <div *ngSwitchDefault>
                        {{ getCellData(subRow, col.field) }}
                    </div>
                    <!-- end: implementation detail. IGNORE. -->
                </td>
            </tr>
        </ng-template>
    </ng-template>
    <!-- end: row table layout -->

yigitfindikli
Posts: 335
Joined: 08 Aug 2018, 14:09

20 Dec 2018, 09:53

Hello,
Could you please create a ticket at GitHub with stackblitz ?

eyassud
Posts: 7
Joined: 30 Mar 2019, 19:11

30 Mar 2019, 19:21

Did you find a resolution or workaround for this issue?

eyassud
Posts: 7
Joined: 30 Mar 2019, 19:11

30 Mar 2019, 23:17

yigitfindikli wrote:
20 Dec 2018, 09:53
Hello,
Could you please create a ticket at GitHub with stackblitz ?
Here is a sample that demonstrates the issue: https://stackblitz.com/edit/tablewithbadselect

ANAND249
Posts: 1
Joined: 29 Jul 2019, 21:55

29 Jul 2019, 22:01

Hello @promodel did you resolved the above issue, have you created ticket :?: Even I am having same issue :roll: . @PrimeFaces team can u have your attention on it and suggest solution for the above issue.

Post Reply

Return to “PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 2 guests