cancel
Showing results for 
Search instead for 
Did you mean: 
Amik

Cycle through records in an EditForm using Previous and Next Buttons

Introduction

 

Typically, we populate the Item property of an EditForm control with the selected item from a Gallery control from another screen. In this scenario, we want to keep this functionality intact, but also have the option to cycle through the next and previous record in our data source without having to navigate back to the Gallery.

 

It is important to note that this solution leverages non-delegable functions. However, if you can bring the number of rows returned in your query under your delegation limit (default is 500 rows, max 2000 if increased via settings) using delegable Filters, this option will be workable for you, even if your actual data source is larger than the delegation limit.

 

For the purpose of this example, we will keep the Gallery on the same screen to test the solution.

 

Set up our data

 

We going to leverage the With function to “pre-filter” our data to bring the number of rows under my delegation limit. In this example, I have applied two filters I can be certain will return less than 500 rows.

 

In the App Formulas property, enter:

 

named_fx_indexed_data = With(
    {
        _prefiltered_data: Filter(
            'Your List',
            Column1 = "Text1",
            Column2 = "Text2"
        )
    },
    With(
        {
            _indexed_data: ForAll(
                Sequence(CountRows(_prefiltered_data)),
                Patch(
                    Index(
                        _prefiltered_data,
                        Value
                    ),
                    {MyIndex: Value}
                )
            )
        },
        _indexed_data
    )
);

 

Note

 

  • We are leveraging the ForAll and the Index function to Index our table in order correctly identify a specific position in the table.
  • We do not need to use a Named formula to create our Table. The important thing is that we can return a Table. For example, we can create a Variable or generate a Collection using the following on the App OnStart property.

 

ClearCollect(
    MyExampleTable,
    Filter(
        'Your List',
        Column1 = "Text1",
        Column2 = "Text2"
    )
);
ClearCollect(
    IndexedCollection,
    ForAll(
        Sequence(CountRows(MyExampleTable)),
        Patch(
            Index(
                MyExampleTable,
                Value
            ),
            {MyIndex: Value}
        )
    )
)

 

Screen Set Up

 

1. Insert an EditForm control into your screen and set the DataSource property to your data source.

 

2. Insert a Button control into the Screen. On Text property of the Button, enter “Next”.

 

3. On the OnSelect property of the Button control, enter:

 

Set(
    gbl_index,
    If(
        gbl_index = CountRows(named_fx_indexed_data),//stop at the maximum number of rows
        Notify(
            "End of list reached.",
            NotificationType.Warning
        );
        gbl_index,
        gbl_index + 1
    )
);
Set(
        gbl_record, LookUp(
            'Your List',
            ID = LookUp(
                named_fx_indexed_data,
                MyIndex = gbl_index
            ).ID
        )
    
)

 

Note

 

  • If your data source is Dataverse, you should replace “ID” with the unique identifier column (GUID) in your Dataverse table.
  • For this tutorial, we are going to leverage Global Variables. However, you can also achieve the same result using Local Context Variables.

4. Insert another Button control into the Screen. On Text property of the Button, enter “Previous”.

 

5. On the OnSelect property of the “Previous” Button control, enter:

 

Set(
    gbl_index,
    If(
        gbl_index = 1,
        gbl_index,
        gbl_index - 1
    )
);
Set(
    gbl_record,
    LookUp(
        'Your List',
        ID = LookUp(
            named_fx_indexed_data,
            MyIndex = gbl_index
        ).ID
    )
)

 

6. Insert a Gallery control onto your Screen and in the Items property, enter the named formula.

 

named_fx_indexed_data

 

7. On the OnSelect property of the Gallery control, enter:

 

Set(
    gbl_record,
    LookUp(
        'Your List',
        ID = LookUp(
            named_fx_indexed_data,
            MyIndex = ThisItem.MyIndex
        ).ID
    )
);
Set(
    gbl_index,
    ThisItem.MyIndex
);
Navigate(
    'Your Form Screen',
    ScreenTransition.Fade
);
EditForm('Your Form')

 

9. On the Item property of our EditForm, enter:

 

LookUp(
    'Your List',
    ID = LookUp(
        named_fx_indexed_data,
        MyIndex = gbl_index
    ).ID
)

 

Optionally, we can also automatically highlight the current record in the Gallery by updating the TemplateFill property of the Gallery to:

 

If(
    ThisItem.ID = gbl_record.ID,
    Color.LightBlue,
    Color.White
)

 

Final result:

 

Example.gif

 

------------------------------------------------------------------------------------------------------------------------------


If you liked this tutorial, please give it a Thumbs Up.

Imran-Ami Khan