How create link command in Modern UI.

Hi, ​@mos11 to convert PXGridColumn hyperlink with LinkCommand in Modern UI , we can do it from .ts file of that screen .In Modern UI Grid column is configured in the .ts file using decorators, instead of definying Hpyperlink in the aspx.

1.Backend Graph Action ( Same as Classic UI)

2.TypeScript – Configure the Hyperlink Column

import {
PXView,
PXFieldState,
columnConfig
} from "client-controls";

export class YourView extends PXView {

@columnConfig({
commandName: "BZViewPOOrders"
})
UsrBZPONumber: PXFieldState;
}

Hope this work’s for you…! 

Hello ​@mos11 ,

If UsrBZPONumber is defined with a [PXSelector] in the DAC, there is no need to provide a link command in the Modern UI—it will automatically render that field as a link

​@mos11

If the UsrBZPONumber field already has the redirection logic for the PO number in the graph, you can try defining the link command in the TS file like below:

@linkCommand("BZViewPOOrders")
@columnConfig({ width: 140 })
UsrBZPONumber: PXFieldState;

You may also add @controlConfig({ allowEdit: true }) to ensure the field remains interactive in the grid if needed.

1. First you need to define the BZViewPOOrders action in PXScreen as follow

export class <screenID> extends PXScreen {

    BZViewPOOrders: PXActionState;

    ….

}

2. Then define the field as below in relevant PXView class

export class RelevantViewName extends PXView {

    @linkCommand("BZViewPOOrders")
    UsrBZPONumber: PXFieldState;

    ...
}

Hi ​@mos11 , Try with this, 

Ts:

export class MyView extends PXView {

@linkCommand("BZViewPOOrders")

@columnConfig({ width: 140 })

UsrBZPONumber: PXFieldState<PXFieldOptions.CommitChanges>;

}

Html- Field in a Template/Fieldset:

<field name="UsrBZPONumber" config-link-command.bind="'BZViewPOOrders'"></field>

Html- Explicit Grid Column

<qp-grid id="grid" view.bind="MyView">

<qp-column field="UsrBZPONumber" width="140" config-link-command.bind="'BZViewPOOrders'"></qp-column>

</qp-grid>