Skip to main content
Question

In the custom screen, the success message is displayed in red color exception in modern UI

  • December 1, 2025
  • 1 reply
  • 19 views


 Hi Team,

 

We are experiencing an issue in the custom screen: the success message is displayed in red color in the Modern UI.

It should be displayed the same way as in the Classic UI.

 

Please refer to the following files/screenshots:

Screenshot1:Setup Parameters screen – Classic UI
 


Screenshot2:Setup Parameters screen – Modern UI

 


The files we are using for the Modern UI are:

KNMC1010.html

 

<template>

    <qp-tabbar id="tab">

        <qp-tab id="tabMagento" caption="Magento">

            <qp-template id="Magento_form" name="1-1" class="equal-height label-size-m">

                <div slot="A" class="v-stack">

                    <qp-fieldset id="MagentoSetup_Connection" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="Connection Settings">

                        <field name="MagentoURL" class="control-size-xl" ></field>

                        <field name="AuthenticationType" class="control-size-xl"></field>

                        <field name="BearerToken" config-type.bind="2" class="control-size-xl"></field>

                        <field name="ConfirmBearerToken" config-type.bind="2" class="control-size-xl"></field>

                        <field name="AccessToken" config-type.bind="2" class="control-size-xl"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_Queue" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="Queue Processing Settings">

                        <field name="ThresholdCount"></field>

                        <field name="BatchCount"></field>

                        <field name="RetryCount"></field>

                        <field name="CheckProcessTime"></field>

                        <field name="CheckRetrytime"></field>

                        <field name="ProcessSleepTime"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_UOM" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="UOM Based Product Sync Preferences">

                        <field name="IncludeUOMbasedSalesSupport"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_Inventory" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="Inventory Sync Preferences">

                        <field name="QtyAvailable"></field>

                        <field name="QtyAvailableForShipping"></field>

                        <field name="QtyAvailableOnHand"></field>

                        <field name="WarehouseMonitored" class="control-size-xl"></field>

                        <field name="SyncQty" class="control-size-xl"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_KitQuantity" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="Kit Quantity Sync Preferences">

                        <field name="IncludeDefaultKitQty"></field>

                        <field name="IncludePossibleKitQtyComponent"></field>

                        <field name="NonstockQty"></field>

                    </qp-fieldset>

                </div>

 

                <div slot="B" class="v-stack">

                    <qp-fieldset id="MagentoSetup_CustomerSync" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="A to M Customer Sync Preferences">

                        <field name="CustomerClasses" class="control-size-xl"></field>

                        <field name="IncludeCustomerLocation"></field>

                        <field name="IncludeCustomerContact"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_OrderSync" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="A to M Order Sync Preferences">

                        <field name="OrderTypes" class="control-size-xl"></field>

                        <field name="IsSyncOrderEnabledCustomer"></field>

                        <field name="Atleastoneshipmentisconfirmed"></field>

                        <field name="OrderUnpaidbalancebecomesZero"></field>

                        <field name="OrderPaymentAuthorizationPresent"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_OrderUpdate" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="A to M Order Update Preferences">

                        <field name="IncludePaymentDetails"></field>

                        <field name="IncludeInvoiceDetails"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_ShipmentTrigger" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="Shipment Sync Trigger">

                        <field name="ShipmentSyncTrigger" config-class.bind="'vertical'"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_DropShip" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="A to M DropShip ShipVia Sync Preferences">

                        <field name="DropShipShipVia" class="control-size-l"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_Additional" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="Additional Settings">

                        <field name="EnableCustomerAttributeSync"></field>

                    </qp-fieldset>

 

                    <qp-fieldset id="MagentoSetup_EnableFeatures" caption="Individual Sync Status">

                        <qp-grid id="EnableFeatures_grid" view.bind="EnableFeatures"></qp-grid>

                    </qp-fieldset>

                </div>

            </qp-template>

        </qp-tab>

 

        <qp-tab id="tabLogging" caption="Logging">

            <div class="v-stack">

                <qp-fieldset id="MagentoSetup_LoggingLevel" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="Set Logging Level">

                    <field name="LogInfoLevel"></field>

                    <field name="LogErrorLevel"></field>

                </qp-fieldset>

 

                <qp-fieldset id="MagentoSetup_ClearLog" wg-container="MagentoSetup_tab" view.bind="MagentoSetup" caption="Set Clear Log Preferences">

                    <field name="ActivateClearLogProcess"></field>

                    <field name="DailyFrequency"></field>

                    <field name="ExecutionTime"></field>

                    <field name="NoOfDaysToRetainLogs"></field>

                    <field name="RecordsToDelete"></field>

                </qp-fieldset>

            </div>

        </qp-tab>

    </qp-tabbar>

 

    <qp-panel id="ImportSetupParameters" caption="Import XML" auto-repaint="true">

        <qp-fieldset id="ImportSetupParameters_form" wg-container="ImportSetupParameters_formImportXML" view.bind="ImportSetupParameters">

            <field name="IsPackageDetailsInclude"></field>

        </qp-fieldset>

        <footer>

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

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

        </footer>

    </qp-panel>

</template> KNMC1010.ts

import { Messages as SysMessages } from "client-controls/services/messages";

import { createCollection, createSingle, PXScreen, graphInfo, PXActionState, viewInfo, handleEvent, CustomEventType, actionConfig, RowSelectedHandlerArgs, PXViewCollection, PXPageLoadBehavior, ControlParameter } from "client-controls";

import { KNMCMagentoSetup, KNMCEnableSyncFeatures, KNMCMagentoSetup2 } from "./views";

 

@graphInfo({graphType: "KNMagentoConnector.KNMCMagentoSetupMaint", primaryView: "MagentoSetup", })

export class KNMC1010 extends PXScreen {

    importSetup: PXActionState;

 

    MagentoSetup = createSingle(KNMCMagentoSetup);

    @viewInfo({containerName: "Magento"})

    EnableFeatures = createCollection(KNMCEnableSyncFeatures);

    @viewInfo({containerName: "Import XML"})

    ImportSetupParameters = createSingle(KNMCMagentoSetup2);

}

views.ts

import { PXView, PXFieldState, gridConfig, treeConfig, fieldConfig, controlConfig, actionConfig, headerDescription, ICurrencyInfo, disabled, PXFieldOptions, linkCommand, columnConfig, GridColumnShowHideMode, GridColumnType, PXActionState, TextAlign, GridPreset, GridFilterBarVisibility, GridFastFilterVisibility, ISelectorControlConfig, ControlParameter } from "client-controls";

import { KNMC1010 } from "./KNMC1010";

 

// Views

 

export class KNMCMagentoSetup extends PXView  {

 

    MagentoURL : PXFieldState<PXFieldOptions.CommitChanges>;

    AuthenticationType : PXFieldState<PXFieldOptions.CommitChanges>;

    BearerToken : PXFieldState<PXFieldOptions.CommitChanges>;

    ConfirmBearerToken : PXFieldState<PXFieldOptions.CommitChanges>;

    AccessToken : PXFieldState<PXFieldOptions.CommitChanges>;

    ThresholdCount : PXFieldState<PXFieldOptions.CommitChanges>;

    BatchCount : PXFieldState<PXFieldOptions.CommitChanges>;

    RetryCount : PXFieldState<PXFieldOptions.CommitChanges>;

    CheckProcessTime : PXFieldState<PXFieldOptions.CommitChanges>;

    CheckRetrytime : PXFieldState<PXFieldOptions.CommitChanges>;

    ProcessSleepTime : PXFieldState<PXFieldOptions.CommitChanges>;

    IncludeUOMbasedSalesSupport : PXFieldState;

    QtyAvailable : PXFieldState;

    QtyAvailableForShipping : PXFieldState;

    QtyAvailableOnHand : PXFieldState;

    WarehouseMonitored : PXFieldState;

    SyncQty : PXFieldState;

    IncludeDefaultKitQty : PXFieldState;

    IncludePossibleKitQtyComponent : PXFieldState;

    NonstockQty : PXFieldState<PXFieldOptions.CommitChanges>;

    CustomerClasses : PXFieldState;

    IncludeCustomerLocation : PXFieldState;

    IncludeCustomerContact : PXFieldState;

    OrderTypes : PXFieldState;

    IsSyncOrderEnabledCustomer : PXFieldState;

    Atleastoneshipmentisconfirmed : PXFieldState;

    OrderUnpaidbalancebecomesZero : PXFieldState;

    OrderPaymentAuthorizationPresent : PXFieldState;

    IncludePaymentDetails : PXFieldState;

    IncludeInvoiceDetails : PXFieldState;

    @fieldConfig({

  controlType: "qp-radio",

  controlConfig: {

    class: "vertical",

    options: [

      {

        value: "On Shipment Confirmation",

        text: "On Shipment Confirmation"

      },

      {

        value: "On Invoice Release",

        text: "On Invoice Release"

      }

    ]

  }

})

    ShipmentSyncTrigger : PXFieldState<PXFieldOptions.CommitChanges>;

    DropShipShipVia : PXFieldState<PXFieldOptions.CommitChanges>;

    EnableCustomerAttributeSync : PXFieldState;

    LogInfoLevel : PXFieldState;

    LogErrorLevel : PXFieldState;

    ActivateClearLogProcess : PXFieldState<PXFieldOptions.CommitChanges>;

    DailyFrequency : PXFieldState<PXFieldOptions.CommitChanges>;

    ExecutionTime : PXFieldState;

    NoOfDaysToRetainLogs : PXFieldState<PXFieldOptions.CommitChanges>;

    RecordsToDelete : PXFieldState;

}

 

@gridConfig({

    syncPosition: true,

    allowDelete : false,

    allowInsert: false,

    showFastFilter: GridFastFilterVisibility.False,

    preset: GridPreset.Details

})

export class KNMCEnableSyncFeatures extends PXView  {

 

    @columnConfig({width: 180}) SyncName : PXFieldState;

    @columnConfig({width: 80})  Active : PXFieldState;

    @columnConfig({width: 100}) SchedulerFrequency : PXFieldState<PXFieldOptions.CommitChanges>;

}

 

export class KNMCMagentoSetup2 extends PXView  {

 

    IsPackageDetailsInclude : PXFieldState<PXFieldOptions.CommitChanges>;

}

Kindly review the files and suggest a solution so that the success message is displayed the same as in the Classic UI (Black color). Thanks in advance

 

1 reply

Forum|alt.badge.img+3

Hi ​@sagarb13 

It seems that the message about a successful connection is being dropped by a PXException or something similar. However, it has a different visual presentation in the Classic and Modern UIs.

I think you may consider reworking your BLC code to avoid throwing an exception and instead use
View.Ask("Info", "Message", MessageButtons.OK, MessageIcon.Information).

For example:

Base.Document.Ask("Info", "Success", MessageButtons.OK, MessageIcon.Information);

You can keep throwing a PXException for unsuccessful cases, or handle it in a similar way as for successful cases:

Base.Document.Ask("Info", "Failure", MessageButtons.OK, MessageIcon.Error);