Table in a tab control not responsive

Post Reply
Posts: 1
Joined: 23 Jul 2018, 06:39

03 Dec 2018, 07:38

When a Datatable is wrapped inside a fieldset and then inside a tab, it is not responsive in large and medium resolutions.
Can you please advise what needs to be done to fix this issue.

<div class="ui-g-12">

<p-tabPanel header="Vehicles" leftIcon="ui-icon-check">
<p-dataTable selectionMode="single" [(selection)]="selectedVehicle" [value]="vehicleList" [lazy]="false" [rows]="10" [paginator]="true" [rowsPerPageOptions]="[10,20,50,100]" sortMode="multiple" reorderableColumns="true" scrollable="true" unfrozenWidth="calc(100%)" scrollWidth="100%" [exportFilename]="filename" [totalRecords]="totalEventRecords" (onRowSelect)=")" dataKey="VIN" [loading]="searching" [responsive]="true" #table>
<p-column *ngFor="let column of vehicleColumns" [field]="column.field" [header]="column.header" [style]="" [sortable]="column.sortable" [sortField]="column.sortField" [frozen]="column.frozen" >
<ng-template let-col let-row="rowData" pTemplate type="body">
<!-- Check if col.field is a date -->
<span *ngIf="isDateField(row[col.field])" [pTooltip]="row[col.field]" tooltipPosition="bottom">{{row[col.field] | date: 'dd/MM/yyyy'}}</span>
<span *ngIf="!isDateField(row[col.field])" [pTooltip]="row[col.field]" tooltipPosition="bottom">{{row[col.field]}}</span>



Posts: 482
Joined: 12 Sep 2017, 10:44

17 Dec 2018, 09:00

Datatable component is deprecated. Please use table component (

Post Reply

Return to “Ultima - PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest