DevExtream Show popup on datagird row click

I want to show display the pop up (app-process-enrollment) on row click rather than the button click (process column):

I've tried using (onRowClick) on the grid, but cannot get the data to properly load in the popup.

conn-item.component.html

<dx-data-grid *ngIf="sessions && sessions.length > 0" id="sessions" [dataSource]="sessions" keyExpr="Id"
[columnAutoWidth]="true" [allowColumnResizing]="true" [hoverStateEnabled]="true" [showBorders]="false"
[showColumnLines]="false" [showRowLines]="true">

<dxi-column dataField="S.CD" caption="Created" dataType="date" sortOrder="desc"></dxi-column>
<dxi-column *ngIf="c.t== 0" dataField="Summary.pc" caption="PCCost"></dxi-column>
<dxi-column *ngIf="c.t == 0" caption="View" cellTemplate="process"></dxi-column>

<div *dxTemplate="let data of 'process'">
<app-en ="decaudates"></app-en>
</div>
</dx-data-grid>


app-en.component.html

<ng-container *ngIf="mode == 'button'">
<span class="" (click)="showImportUtility()"></span>
</ng-container>

<!-- full screen enrollment process tool -->
<app-dialog #dialog [toolbarTitle]="screenTitle" [fullScreenOnLoad]="true" [showCloseButton]="true"
[dragEnabled]="false" [visible]="showTool" (dialogClosed)="onDialogClosed()">
...
...
</app-dialog>


app-en.component.ts:

showImportUtility(): void {
this.sId = this.s.ISId;
this.PSC = this.s.PSC;
this.showTool = true;
}

Continue reading...