Primeng: Enable row expansion based on row data

Created on 13 Dec 2016  路  10Comments  路  Source: primefaces/primeng

        **<p-column expander="false" field="description">
        </p-column>**
        <p-column field="description" header="Response Group" filter="true" [sortable]="true"> </p-column>
        <p-column field="responsetypedescription" header="Response Type" filter="true" [sortable]="true"></p-column>

        <template let-model>
            <div class="ui-grid ui-grid-responsive ui-fluid" style="font-size:16px;padding:20px;border:none" *ngIf="model.description">
                <div class="ui-grid-row">
                    <div class="ui-grid-col-9">
                        <div class="ui-grid-col-10">{{model.description}}</div>
                    </div>
                </div>

            </div>
        </template>
    </p-dataTable>

Note: there is no meaning for expander to true or false bcz it always show the expander icon. but my requirement is based on the data i want to show the expander icon and hide this icon.

Most helpful comment

Try this:
<p-column [expander]="false" field="description">

All 10 comments

Having the same issue. expander="false" does not seem to affect anything. Icon is still visible and active.

Having the same issue. Please help

Try this:
<p-column [expander]="false" field="description">

@seidme
I need to enable it for a specific row based on current grid data
How can fix this with grid data value instead of using false or true ?

Any solution for hiding expander for certain rows?

Here is a not-so-ugly workaround, using the rowStyleClass attribute of p-dataTable:

<p-dataTable [value]="listData" [totalRecords]="length" [rows]="10" [paginator]="true" 
[responsive]="true" [pageLinks]="6" [rowsPerPageOptions]="[5,10,20]" expandableRows="true"
[rowStyleClass]="rowClass">

In your component.ts:

rowClass(rowData) {
  return rowData.HasAnnexes ? '' : 'noExpander';
}

In your css:

.noExpander span.ui-row-toggler {
  display: none;
}

The rowClass attribute of p-dataTable takes a function that gets the row data and row index as parameters and returns a style class for the row. In this case, it uses the noExpander css class if the certain row HasAnnexes, otherwise do not use any css class.

@sudheerj or @cagataycivici : If this is a valid request then can this be taken up in your current or next sprint?

Any update on this issue.

Also looking for an update on this issue.

p-dataTable is deprecated and will be removed in favor of the new p-table (aka TurboTable) of 5.1.0 so closing the issue. Please try the new p-table once 5.1.0 is released.

Was this page helpful?
0 / 5 - 0 ratings