p-frozencolumn not wokring

[Balakoteswararo]

Describe the bug

in application iam using the p-frozencolumn for froze columns in table. with primeng version :11 below image is for the reference.

this is what iam using code in html:

Vendor Description Baseline Vendor Name Actions $/Unit Total$ Lowest Bid ($) Actions Qty Type Bid Value Savings Current Per Yard {{lineitm.blVendorDescription}}

Quantity - {{lineitm.blServiceQuantity}}

Size - {{lineitm.blSize}}

#of times - {{lineitm.blNoOfTimes}}

Frequency - {{lineitm.blServiceFrequency}}

MRC -

Serviced On - {{lineitm.blServicedOn}}

{{lineitm.nlTotalPerUnit|currency:'USD':'symbol':'1.4-4'}} {{lineitm.nlTotal|currency:'USD':'symbol':'1.4-4'}} {{lineitm.lowestBidPrice}}

Avg : {{lineitm.avgValue|currency:'USD':'symbol':'1.2-2'}}

{{lineitm.serviceBehaviour}} {{ lineitm.savings |currency:'USD':'symbol':'1.4-4'}} {{lineitm.perYardRate}}

Environment

local

Reproducer

No response

Angular version

12.2.18

PrimeNG version

11

Build / Runtime

Angular CLI App

Language

ALL

Node version (for AoT issues node --version)

16.10

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

No response

[Balakoteswararo]

not appended css properties for frozencolumn form primeng

[Balakoteswararo]

can you any one resolved the issue?

[Balakoteswararo]

Describe the bug

in application iam using the p-frozencolumn for froze columns in table. with primeng version :11 below image is for the reference.

this is what iam using code in html:

<p-table  [scrollable]="true" scrollHeight="400px" styleClass="mt-3">
    <ng-template pTemplate="header">
        <tr>
            <th pFrozenColumn>
                Vendor Description</th>
            <th pFrozenColumn colspan="6">Baseline</th>
            <th colspan="5">Vendor Name
                <!-- <ng-container *ngIf="lineitm.lineItemType=='Services'">
                {{lineitm.serviceBehaviour}}
                </ng-container>    -->
            </th>
        </tr>
        <tr>
            <th pFrozenColumn></th>
            <th pFrozenColumn>Actions</th>
            <th pFrozenColumn colspan="2"></th>
            <th pFrozenColumn>$/Unit</th>
            <th pFrozenColumn>Total$</th>
            <th pFrozenColumn>Lowest Bid ($)</th>
            <th>Actions</th>
            <th>Qty Type</th>
            <th>Bid Value</th>
            <th>Savings</th>
            <th>Current Per Yard</th>

        </tr>
    </ng-template>
    <ng-template pTemplate="body">
        <tr>
            <td pFrozenColumn >
                <button type="button" pButton pRipple [pRowToggler]="lineitm"
                class="p-button-text p-button-rounded p-button-plain p-mr-2"
                [icon]="expanded ? 'pi pi-chevron-down' : 'pi pi-chevron-right'"></button>
                <span class="p-text-bold p-ml-2">{{lineitm.blVendorDescription}}</span>
            </td>
            <td pFrozenColumn >
                <span class="p-column-title" title="Edit">
                    <a (click)="onLineitemAddEdit(lineitm,'B')"> <i class="pi pi-pencil p-p-2"></i></a>
                </span>
                <span class="p-column-title" title="Move Out">
                    <a (click)="MoveOutBaseline(lineitm,'MoveOutBaseline','Service')">
                        <i class="pi pi-arrow-circle-right  p-p-2"></i></a>
                </span>
            </td>
            <td pFrozenColumn><p>Quantity - {{lineitm.blServiceQuantity}}</p>
                <p>Size - {{lineitm.blSize}}</p>
                <p>#of times - {{lineitm.blNoOfTimes}}</p>
            </td>
            <td pFrozenColumn>
                <p>Frequency - {{lineitm.blServiceFrequency}}</p>
                <p>MRC - <span>
                            <input type="checkbox" [(ngModel)]="lineitm.blMonthlyRecurringCharge"
                                [checked]="lineitm.blMonthlyRecurringCharge" (click)="onCheckClick($event)">
                        </span>
                </p>
                <p>Serviced On - {{lineitm.blServicedOn}} </p>
            </td>
                <td> {{lineitm.nlTotalPerUnit|currency:'USD':'symbol':'1.4-4'}} </td>
                <td> {{lineitm.nlTotal|currency:'USD':'symbol':'1.4-4'}} </td>
            <td pFrozenColumn>
                <a (click)="DisplayRelatedLineitems(lineitm);"
                style="cursor: pointer;text-decoration: underline;color:blue;">{{lineitm.lowestBidPrice}}</a>
                <p> Avg : {{lineitm.avgValue|currency:'USD':'symbol':'1.2-2'}} </p>
            </td>

            <td><span><a><i class="pi pi-pencil p-p-1"></i></a></span>
                <span class="p-column-title" title="Archive">
                    <a (click)="Archive(lineitm,'Archive','Service')"> <i
                            class="fa fa-archive p-p-1"></i></a></span>   
                <p-checkbox [(ngModel)]="lineitm.isBidAwarded" binary="true" [disabled]="isDisableEditFields"
                            (onChange)="onBidAwaredChange(lineitm)" inputId="binary"></p-checkbox>     
            </td>
            <td>
                <ng-container *ngIf="lineitm.lineItemType=='Services'">
                {{lineitm.serviceBehaviour}}
                </ng-container>
            </td>
            <td>
                <p-inputNumber [(ngModel)]="lineitm.vendorBidValue"
                        [disabled]="isDisableEditFields" inputId="vendorbilledintegeronly"
                        (onBlur)="UpdateSavings(lineitm);" mode="decimal" locale="en-US"
                        [minFractionDigits]="4" [style]="{'width':'100%'}"></p-inputNumber>
            </td>
            <td> {{ lineitm.savings |currency:'USD':'symbol':'1.4-4'}}</td>
            <td> {{lineitm.perYardRate}} </td>
        </tr>
    </ng-template>
</p-table>

Environment

local

Reproducer

No response

Angular version

12.2.18

PrimeNG version

11

Build / Runtime

Angular CLI App

Language

ALL

Node version (for AoT issues node --version)

16.10

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

No response

[jagdishpatil02]

Hi, @Balakoteswararo. From what I see, there is no data present for the columns, so it appears that the frozen column is not working. I have created the same demo with dummy data, and it is working perfectly fine. Additionally, you can display the message 'no data available' if the data is not present (check attached images for reference)