Link two tables

Tags: #<Tag:0x00007f8b28d34c48>
#1

Hi,
I have a scenario where I am displaying 2 tables.
Table 1 has columns:
row# col1 col2 col3
1 abc def ghi
2 lmn xxx xxx

Table 2 has columns:
row# displaycode displayvalue
1 someval someval

Now in table2, row# column is clickable and when the value in the column is clicked , I should highlight the row in table1 and take the cursor to that row.
For example, here when ‘1’ is clicked in table2, I should highlight row #1 in table1 and cursor should be taken there

How can I achieve this?

Thanks

#2

Welcome @krishI have made a demo https://jsfiddle.net/AMBudnik/q4m23j6z/ with your data.

Can you specify what cell do you click and where the focus moves?

#3

Thanks!
I will just change the TABLE2 values to be clear, if TABLE2 has values
A B
abc displayvalue
lmn somevalue

In the TABLE2, if abcis clicked, I should highlight the row 1 and take cursor to that row

#4

you can use the selectCell method and then the getCellEditor.

#5

Can you add those methods on the demo that you created.
selectCell may probably select that cell not the entire row right?

#6

Actually you can pass a range there (the name is a bit misleading).

image.png737×356 25.4 KB

ps. I cannot create a whole example for you, but I can help if you’d encounter any difficulties.

#7

Sure. I should be able to use the table1 instance to selectCell which is all together in a different component.

#8

Hey @krish

how’s the implementation?

#9

Hi,
I am using javascript function which dispatches an event with the row#.

#10

Great. Thank you for an update. It seems like the topic is moving well.

If you’d need anything please create a new topic.

#11