Open PopUp when click Row in Table

Ignition
1

I have table like this,
image

I confused when success click row and displayed PopUp, but the data can't displayed.
Then, I'm asking for help because maybe I lost the step.

First, I create view PopUp and add params.
Params:
image
PopUp
image

Binding label
image
image
image

After that, configuration table "OnRowClick" for displaying PopUp

image
image940×488 31.8 KB

After all step, did I skip any steps or configure it wrong?

2

I think you have set up the popup's parameters to expect a rowData object but you are passing three individual parameters of type value.

You need to either,

  • Pass a rowData object, or ...
  • Add the individual parameters to the popup and bind to those instead of rowData.
3

Is there a reason you set the input values to view.params.rowData.[DATA] and not to the data selected in the table, like Table.props.selection.data?

This way, you pass only a single parameter to the popup, and can select components of the dataset using data.0.[DEFECT/LEVEL/QTY].

I tested this, and did notice another issue: the onRowClick event triggers before the data selection is updated, so your previous selection is passed to the popup. You can overcome this by using the onRowDoubleClick event and have users double-click a line to open the popup. The first click updates the props.selection.data property and the second click opens the popup.

The event binding for the table:

image
image1222×761 74.7 KB

The sole parameter in the popup
image

I created a table in the popup to display the data passed to the popup, but you can easily access each data point as described above.

image
image988×215 14.7 KB

4 Likes
4

Actually I want input values to Table.props.selection.data.
But, my reason input values views.props.rowData.[Data], because when I try binding label data to direct data I can't find table.props.selection.

image
image1253×731 50.6 KB

After that, I still try to using view.params.[DEFECT/LEVEL/QTY] in label then params in PopUp same like you (Table.props.selection.data).
I success display data, but not specific column.
image

Can you guide me binding data to data.0.[DEFECT] because I still can't find that.

5

Update, I can setting dataset data.0.[DEFECT/LEVEL/QTY] and worked.
Thankyou very much

1 Like
6

After implemented I notice another issue, select components of the dataset using data.0.[DATA] just only can select 1 component right ? because when I try implement param direct data.1.[DATA] can't display value.

7

I was figured out too with change selection.mode to be Multiple Interval

8

Edited, Just read Alex_DeBate post. I was not aware you could pass all the selected data in one parameter. Thats good to know :+1:.

1 Like
9

The way that you are opening the popup with the onRowDoubleClick method means that ONLY 1 row of data can be selected. If you want to pass more than one entry, you will need to add a separate button or other method of launching the popup that is enabled ONLY if table.props.selection.data is not empty. Then, users can select one or multiple rows and only launch the popup when they have selected all the relevant data.

2 Likes