0

How can i solve this problem I want to resize row length proper using PrimeNG Datatable? Now My Data Display Like These [Now My Data Display Like These

And I want to change Like These And I want to change Like These

Sachin from Pune
  • 656
  • 8
  • 19
  • Could you give a little more detail on what exactly is desired? Are you wanting it to automatically resize or just be able to resize the columns? I am assuming automatic, but if you just want them to be resizable, then add resizable to your p-column ``. – MapLion Nov 16 '17 at 18:36
  • okay. i want if data is long then data shows on new line, like my 2nd image @MapLion – Sachin from Pune Nov 16 '17 at 18:42
  • Possible duplicate of [How to expand row from datatable programmatically](https://stackoverflow.com/questions/42838838/how-to-expand-row-from-datatable-programmatically) – MapLion Nov 16 '17 at 18:55

1 Answers1

1

Without a more elaborate setup, I would recommend utilizing the resizableColumns, expandableRows and expandedRows options on the p-dataTable and set your widths as percentages as well as make your columns manually adjustable (https://www.primefaces.org/primeng/#/datatable); for example, something like:

<p-dataTable [value]="cars" [resizableColumns]="true" [expandableRows]="true" [expandedRows]="expandedItems">
    <p-column field="vin" header="Vin" [resizable]="true" [style]="{'width':'20%'}"></p-column>
    <p-column field="year" header="Year" [resizable]="true" [style]="{'width':'30%'}"></p-column>
    <p-column field="brand" header="Brand" [resizable]="true" [style]="{'width':'15%'}"></p-column>
    <p-column field="color" header="Color" [resizable]="true" [style]="{'width':'35%'}"></p-column>
</p-dataTable>

For more detail, see this StackOverflow: How to expand row from datatable programmatically

MapLion
  • 1,041
  • 1
  • 12
  • 38