Skip to main content
Question

Modern UI 25R2: SmartPanel Grid not auto-loading data (Refresh button required)

  • February 26, 2026
  • 1 reply
  • 36 views

Hi everyone,

I’m working on a custom screen in Acumatica 25R2 Modern UI and I’m facing an issue with a qp-panel containing a qp-grid.

The scenario: I have a primary view for "Pick Lists" and a SmartPanel to "Add Shipments". When I click the action button to open the popup, the grid inside the panel remains empty. It only shows the data after I manually click the "Refresh" button inside the grid's toolbar.

What I've tried:

  1. I tried using syncState: true or syncChanges: true in the topBarItems configuration within views.ts, but I get a compilation error: TS2353: Object literal may only specify known properties. It seems these properties are not available in the IToolBarItem type for 25R2.

  2. I added auto-load="true" to the qp-grid in the HTML, but it still doesn't trigger the initial fetch.

  3. I implemented a @handleEvent in the .ts file to call this.view.refresh(), but the grid still initializes empty when the panel opens.

 

View definition (C#):

public SelectFrom<SOOrderShipment>
    .InnerJoin<SOShipment>.On<SOShipment.shipmentNbr.IsEqual<SOOrderShipment.shipmentNbr>>
    .Where<SOShipment.siteID.IsEqual<FRSOPickList.siteID.FromCurrent>>
    .View shipmentlist;

 

Grid Configuration (view.ts):

@gridConfig({
    allowInsert: false,
    showFastFilter: GridFastFilterVisibility.False,
    preset: GridPreset.Details,
    topBarItems: {
        addShipment: { index: 0, config: { commandName: "SelectShipment", text: "Add Shipment", popupPanel: "PanelAddShipment" } },
    }
})

export class OrderList extends PXView {
    addShipment: PXActionState;
    @columnConfig({ width: 90 }) ShipmentNbr: PXFieldState;
}

 

@gridConfig({
    autoAdjustColumns: true,
    showFastFilter: GridFastFilterVisibility.False,
    preset: GridPreset.Details
})
export class shipmentlist extends PXView {

    @columnConfig({ allowSort: false, allowNull: false, width: 40, textAlign: TextAlign.Center, type: GridColumnType.CheckBox }) Selected: PXFieldState;
    @columnConfig({ allowUpdate: false, width: 70 }) OrderType: PXFieldState;
    @columnConfig({ allowUpdate: false, width: 108 }) OrderNbr: PXFieldState;
    @columnConfig({ allowUpdate: false, width: 108 }) ShipmentNbr: PXFieldState;
    @columnConfig({ allowUpdate: false, width: 81, format: "AAAAAAAAAA" }) CustomerID: PXFieldState;
    @columnConfig({ allowUpdate: false, width: 63, format: ">AAAAAAA" }) CustomerLocationID: PXFieldState;
    @columnConfig({ allowUpdate: false, width: 90 }) ShipDate: PXFieldState;
    @columnConfig({ allowUpdate: false, allowNull: false, width: 81, textAlign: TextAlign.Right }) ShipmentQty: PXFieldState;
}

 

HTML:

    <qp-panel id="PanelAddShipment" view.bind="shipmentlist" caption="Add Shipment">
        <qp-grid id="grid4" view.bind="shipmentlist" auto-load="true" load-data="Always"></qp-grid>
        <footer>
            <qp-button id="btnAddShipment" caption="Add" state.bind="AddShipment"></qp-button>

            <qp-button id="btnAddAndClose" caption="Add & Close" state.bind="AddShipment"
                dialog-result="OK"></qp-button>

            <qp-button id="btnCancel" caption="Cancel" dialog-result="OK"></qp-button>
        </footer>
    </qp-panel>

 

 

1 reply

jhonlloydgelica69
Freshman II
Forum|alt.badge.img

Hi ​@mcoral62. I encountered the same issue and my solution is to add auto-repaint="true" to the qp-panel element, not the grid.

HTML
just change your HTML to this

<qp-panel id="PanelAddShipment" view.bind="shipmentlist" caption="Add Shipment" auto-repaint="true">

    <qp-grid id="grid4" view.bind="shipmentlist"></qp-grid>

    <footer>

        <qp-button id="btnAddShipment" caption="Add" state.bind="AddShipment"></qp-button>

        <qp-button id="btnAddAndClose" caption="Add & Close" state.bind="AddShipment" dialog-result="OK"></qp-button>

        <qp-button id="btnCancel" caption="Cancel" dialog-result="OK"></qp-button>

    </footer>

</qp-panel>

Then verify your Typescript configuration 

  • Confirm if shipmentlist view is created with createCollection() in the main screen class

Hope it helps!