# Open PopUp when click Row in Table

**URL:** <https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [January 2, 2024, 9:47am UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675 "2024-01-02T09:47:58Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![hisyam\_agung](https://avatars.discourse-cdn.com/v4/letter/h/9dc877/32.png) [@hisyam\_agung](https://forum.inductiveautomation.com/u/hisyam_agung)\
**Post date:** [January 2, 2024, 9:47am UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/1 "2024-01-02T09:47:58Z")

</div>

I have table like this,  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/a/aacfd04501937046b2f87c99a5de41d0d6ac8fa1.png)

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](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/6/361dad53faf0fa057108b9f66761830d60e2c5aa.png)  
PopUp  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/c/5ca983695f0b63eb88d06d9577fb0ee9768c9334.png)

Binding label  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/d/5d576404c5b50ff894fc237f27a09097e814fea0.png)  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/0/70a09d158c33a1e947c47589182386f9a749c423.png)  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/8/48abba8367d396fb8ec701bb83263b73c08fdeda.png)

After that, configuration table "OnRowClick" for displaying PopUp

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/d/0d67fcc3c789952278b2439a60560062db018f9f.png)

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

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [January 2, 2024, 12:21pm UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/2 "2024-01-02T12:21:47Z")

</div>

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`.

---

<div class="post-metadata">

**Author:** ![Alex\_DeBate](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alex_debate/32/56483_2.png) [@Alex\_DeBate](https://forum.inductiveautomation.com/u/Alex_DeBate)\
**Post date:** [January 2, 2024, 9:59pm UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/3 "2024-01-02T21:59:35Z")

</div>

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](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/e/ce679f23f502e5b1520a9a07290d21bfe8ccfb78.png)

The sole parameter in the popup  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/3/83ac4e42e517d43941c6cb5d777e9d17fc046a1d.png)

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](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/a/fab405a96971c82a461cbb38a5856f6d6337bba8.png)

---

<div class="post-metadata">

**Author:** ![hisyam\_agung](https://avatars.discourse-cdn.com/v4/letter/h/9dc877/32.png) [@hisyam\_agung](https://forum.inductiveautomation.com/u/hisyam_agung)\
**Post date:** [January 3, 2024, 1:53am UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/4 "2024-01-03T01:53:02Z")

</div>

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](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/a/6a1d92fa5e9f4abaf8218cfaaca49a3ad8366bdf.png)

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](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/0/502dd07633048a8d3fc9a604a741fceb57d3cd8f.png)

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

---

<div class="post-metadata">

**Author:** ![hisyam\_agung](https://avatars.discourse-cdn.com/v4/letter/h/9dc877/32.png) [@hisyam\_agung](https://forum.inductiveautomation.com/u/hisyam_agung)\
**Post date:** [January 3, 2024, 3:05am UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/5 "2024-01-03T03:05:35Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![hisyam\_agung](https://avatars.discourse-cdn.com/v4/letter/h/9dc877/32.png) [@hisyam\_agung](https://forum.inductiveautomation.com/u/hisyam_agung)\
**Post date:** [January 3, 2024, 3:57am UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/6 "2024-01-03T03:57:38Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![hisyam\_agung](https://avatars.discourse-cdn.com/v4/letter/h/9dc877/32.png) [@hisyam\_agung](https://forum.inductiveautomation.com/u/hisyam_agung)\
**Post date:** [January 3, 2024, 4:03am UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/7 "2024-01-03T04:03:09Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![craigb](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@craigb](https://forum.inductiveautomation.com/u/craigb)\
**Post date:** [January 3, 2024, 4:26am UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/8 "2024-01-03T04:26:29Z")

</div>

Edited, Just read Alex\_DeBate post. I was not aware you could pass all the selected data in one parameter. Thats good to know 👍.

---

<div class="post-metadata">

**Author:** ![Alex\_DeBate](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alex_debate/32/56483_2.png) [@Alex\_DeBate](https://forum.inductiveautomation.com/u/Alex_DeBate)\
**Post date:** [January 3, 2024, 1:37pm UTC](https://forum.inductiveautomation.com/t/open-popup-when-click-row-in-table/83675/9 "2024-01-03T13:37:03Z")

</div>

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.
