Getting Row Focus on a Table

App Building
1

I reported on this earlier and I don't think anyone had a solution.

I have figured this out by trial an error.

My problem was that when I opened up my tables, there was no focus on a particular row. I had to click into the table to get the row to ,light up.

I have found a solution.

The Primary Key field must be empty for focus to occur. I was entering the Primary Key for the table and for some reason that stopped the focus on the first row.

Also you must set the default index to 0.

I am attaching a screen capture,

Mike

pict1
pict11185×580 121 KB

pict2
pict21193×625 123 KB

1 Like
2

Hey Mike,

This is the default behaviour with new tables, it expects you to have a primary key in order to have row selection capability.

Worth adding here if you update underlying query PK will be deselected in some cases forcing you to select it again.

3

Stefan:

I am glad this works for you.

If I put in my Primary Key, I do not get a selected row until I click into the screen.

I want my users to have a highlighted row as soon as the table comes up.

Mike

4

Hello @mdsmith1,

You can use a JS Query to select a row, and set this JS Query to run on page load!

CleanShot 2025-01-02 at 17.05.43@2x
CleanShot 2025-01-02 at 17.05.43@2x984×686 23.1 KB

CleanShot 2025-01-02 at 17.05.53@2x
CleanShot 2025-01-02 at 17.05.53@2x994×912 40.7 KB

If you do not pass any value into the () of the function it will default to selecting the first row. You can chose another row by passing in a number for the row, zero being the first and counting up from there.

As @stefancvrkotic said you will need to have the PK specified for rows to be selectable.

But as you pointed out the new table has a default option to specify the row at index zero to be selected on page load.

3 Likes
5

Jack:

Yes, it worked.

I now have the primary key in the primary key field and have table1.SelectRow() in the Event Handler and it works perfectly.

Thank you very much.

I have marked this as the Solution.

Mike

1 Like
6

I think I spoke too soon.

The solution I put together gives a focus on the first row, but it prevents movement to a different row,

I need to understand where the table1.selectRow() is supposed to be placed.

I have set it up so that will only fire on page load.

Mike

7

Ahhh ok.

My idea was that the query that runs table1.selectRow() would have the checkbox to run that just once on page load and then you should be able to click on other rows to change which is being selected.

And then only on page load/hard refresh would the query run again to re-set the focus to the first row.

Are you still using the "Default Index" in the table inspector on the right side? That may be causing the table to override the clicks that would change the selection.

8

Jack:
I went through all this again.
The only way I can get a focus on table open is to have no primary key and a default index of 0 and no code in the event handler.
This all works fine for me.
I think this should be viewed as a bug.
The Legacy Table does not have these problems. Its just with the New Table.
I believe this is a bug.
Mike

9

Ok,

So you do get the intended behavior when you use the component's settings in the inspector to set the default index to zero.

What did you try with the JS Query script that did not work? Did the checkbox to run the query on page load not cause the query to run?

10

Jack:

I don't think we should spend any more time on this.
We are discussing work arounds because the New Table does not focus properly on opening and does not scroll properly.
I have it working with my work arounds.
I think the thrust should be getting the bugs fixed so the New Table works naturally.
The Legacy Table does not have these problems.

Mike

1 Like