Answered

Force selection of gallery item when tab selection changes

(0) Share

Report

Posted on by SachS

151

I have a simple issue tracker based on a SharePoint list. For the sake of simplicity, let's say it has [ Title ] and [ Priority ] columns (and the built in Created and Created By columns as well).

The app is simple as well, created using a default template offered when you select 'Start with a page design' where you have a Gallery and an EditForm:

Above the Gallery, I've added a modern 'Tab List' control, with 3 tabs: [ All, Today, Mine ]. I'd like selecting each of the tabs to filter the list as follows.

All - All items in the list
Today - Items created today
Mine - Items created by the user

TabList.Items:

Table(
 {
 TabName: "All",
 TabValue: 1
 },
 {
 TabName: "Today",
 TabValue: 2
 },
 {
 TabName: "Mine",
 TabValue: 3
 }
)

TabList.OnChange:

Set(
 varSelectedTab,
 Self.Selected.TabName
)

Gallery.Items:

SortByColumns(
 Filter(
 TabTestList,
 If(
 varSelectedTab = "Mine",
 ThisRecord.'Created By'.Email = User().Email,
 If(
 varSelectedTab = "Today",
 DateValue(Text(ThisRecord.Created)) = Today(),
 true
 )
 )
 ),
 "Created",
 SortOrder.Descending
)

This works fine, and filters the list accordingly and displays in the gallery. However, I have an issue with the items being selected/not selected depending on the tab selection.

For example, consider the following scenario. There are 3 items in the list, with the first two (based on Created date) created by me while the most recent item being created by some other user. Now, on app load the 'All' tab is selected, and in the Gallery all list items are displayed, and the first item (most recent - created by other user) is selected:

However, if I select the 'Mine' tab, it filters out the other user (as expected), but then the Gallery 'loses' the selection (since previously selected item is no longer in the gallery):

I would ideally like the gallery to always select the first (top item, based on my sort criteria that would always be the most recently created item) item.

I tried setting the Gallery.Default:

First(Self.AllItems)

which achieves the desired result, but with the very undesirable side effect that whenever I click on a different item on the list it immediately jumps back to the top item.

How can I force the gallery to select the first item on tab change without the above issue?

Categories:

Building Power Apps

I have the same question (0)

All responses (4)

Answers (1)

Sort by

Verified answer

narayan225 2,547 Moderator on at

Like
a
(1)

Report
Copy link

Link copied!
@SachS

Instead of using Filter, use Switch. For onchange even of the tablist.

Set( varSelectedTab, Self.Selected.TabName ); Switch( varSelectedTab, "All", Set( filterData, tableName ), "Today", Set( filterData, Filter( tableName, Created = Today() ) ), "Mine", Set( filterData, Filter( tableName, 'Created By'.Email = User().Email ) ) );

Set items property of the gallery to filterData and the default property to

With({wList:filterData},First(wList))
This should fix your problem with no issue.

That is what I have implemented in my environment.

Hope this helps.

Cheers!

Was this reply helpful? Yes No
SachS 151 on at

Like
a
(1)

Report
Copy link

Link copied!

@narayan225 thank you, this worked with one minor tweak.

Since I need to sort the list in descending order by created date, I needed to use `Last(wList)` instead of `First()`.

Was this reply helpful? Yes No
SachS 151 on at

Like
a
(0)

Report
Copy link

Link copied!

@narayan225 upon doing some testing I realized that while this fixed the selection problem, it creates another bigger issue: when I use this method, I'm essentially setting a variable instead of the actual data source as Items for the gallery, and thus the SubmitForm stops working. If I try to do an edit on the Form, it doesn't actually go into the data source for obvious reasons.

Was this reply helpful? Yes No
narayan225 2,547 Moderator on at

Like
a
(1)

Report
Copy link

Link copied!
@SachS

To tackle that issue, you can set the datasource of the form to the actual data source i.e., your SharePoint list name.
And the item property to lookup datasource with the id selected from gallery.
For example.
LookUp(tableName,ID = Gallery.Selected.ID)
After this when you submit the form, it will submit to the data source as you will be working directly with data source.

Hope this makes sense.

Cheers!

Was this reply helpful? Yes No