Go from LFD list view to another filtered LFD screen

Get Help
1

I have an LFD that will list team names. When I click on one of the teams from the list I need to go to another screen that is now filtered by the team name I selected.

2

Hi Catalina,

You can achieve with a few simple steps.

In your LFD with team names you need to put the following code in the screen JS.

Fliplet.Hooks.on('flListDataBeforeGetData', function(options) {
  options.config.beforeOpen = function(item) {
    Fliplet.Navigate.screen(12345, {
      query:
        '?dynamicListFilterColumn=Name&dynamicListFilterValue=' +
        encodeURIComponent(item.entry.data.Name)
    });
    return Promise.reject('');
  };
})

In the snippet the following changes are needed:

  1. The screen ID of the screen where you want to navigate, 12345 in this example.
  2. The name of the column in the data source where your team names are stored. This will be needed in the ‘item.entry.data.Name’. In this case it is ‘Name’ but might be different for your data source.
  3. Also you need the column in the target LFD where the names you want to filter by are stored. This will need to be changed in the ‘dynamicListFilterColumn=Name’ section i.e. the Name might need to be changed.

Hope this helps!
Thanks,
Deb

3

Hello again,
Thanks for your reply, I applied the code and it works great, there is only thing that is not working as expected. When I click on the team and am brought to the new LFD screen that is filtered by that team. If I click on the “x” to close the filter bubble it doesn’t work, nothing happens when I click it. I must open up the “filter by” overlay screen and from there select the “Clear” button. Only this way am I able to clear the filter. How can I fix this so that when I click on the “x” bubble it will close from there without having to open the “filter by” overlay.

4

Do you have any other code running in the page JS? Specifically any under this hook:

Fliplet.Hooks.on('flListDataAfterRenderList', fn);
5

No, the only custom js code that I added was the one that you sent above.

6

Hi Can i use this same code for an onclick.

I’m trying the code below but it’s not working. If I remove the query it works, I know I’m doing something wrong, any idea what it is?
this one works:
$(document).on(‘click’, ‘#locationNavBtn’ ,function(){
Fliplet.Navigate.screen(‘Offices’);
});

this one does not:
$(document).on(‘click’, ‘#locationNavBtn’ ,function() {
Fliplet.Navigate.screen(‘Office’, {
query: ‘?dynamicListFilterColumn=Name&dynamicListFilterValue=’ +
encodeURIComponent(item.entry.data.Office)
});
})

7

The code itself looks ok, it might be possible that the item you are trying to click on has another click event running on top of it interfering with this one. This could be set through the custom code or through the component settings.