Refresh / Reload data in a List Block

Hi Boris,

This would look like this:

<script>
window.addEventListener('block-loaded-list1', () => {
    window.addEventListener('call-api-success-list1', () => {
        setTimeout(() => {
            window.dispatchEvent(new CustomEvent('reload-block-list1'));
        }, 2000); 
    });
});
</script>

Change list1 by your block ID/Name
Change 2000 (milliseconds = 2 seconds) by the delay you would need

1 Like

Hi @matthieu_chateau

Thanks for the tip. I tried it, but it doesn’t seem to work. I am not getting the block reload.

Maybe I missed something?

thx

Can you try in the header (Code Inside Header)? In general, all scripts must be in the header in Softr.

If not working I will check if the event listener call-api-success has been released.

Thank you @matthieu_chateau

So, this is interesting…

Putting this code in the header works. I can see the page reload. However, on the page in my List Block I have an Action Button whose display is conditional and is based on specific values in Airtable that get updated by the Action itself.

The weirdest thing - the page reloads but the Action Button’s conditional appearance isn’t respecting the new Airtable values that are being updated by the Action API call.

I thought it was a delay issue with processing the API call, which triggers a webhook that does the actual Airtable update job. But no, even if I delay it significantly, it refreshes the page, but the conditional logic does not respect the updated values in Airtable. Only if I refresh the page manually is when those values are respected by the conditional display logic.

Boris

Is the button visibilty ruled by a user group?

User Group + “On Which Records” condition…

It’s the “On Which Records” condition that ultimately does the magic of revealing or hiding the button, because the API call invoked by the button updates Airtable data that ultimately causes this condition to resolve to true or false…

does this look like a bug?

The gist of it is:
I have the custom code setup to reload the page in 5 secs. It can be clearly seen how the page gets reloaded but the button does not get updated with the reload. Only manually reloading the page updates the button.

@bbelo can you pls ping the team on Monday via live chat we could help troubleshoot and then share back here ?

@artur Actually, I am experiencing a similar issue.

  • The main Softr page on opening checks whether Term & Conditions are accepted and if not - opens a Modal window asking to accept them
  • “User” record in Airtable is updated in popping-up modal window, marking that T&C are accepted
  • After the Users record is successfully updated the code waits 2 sec and then throws window.parent.location.reload() to return to the main page
  • The main Softr page has 2 blocks - one is connected to Users table and the second one - connected to another table, but filtered on current User’s record data

Result - the first component, which is connected to Users table - is updated immediately. The second one, which is connected to another table but being filtered based on current User’s record, which has been changed - is updated about 1 min later only (!!!) - 15 sec delays, code reloads, browser reloads - nothing helps, the data remains inconsistent for about a minute :confounded:

What could be a solution, how could I force an update of data in current User’s record? - as in my understanding the problem is exactly there

Hi @artur

I’ve been already working with Aramayis on this for the last couple of weeks. He came back yesterday asking for more (indefinite) time to resolve this. I’ve asked whether the development understand the cause of the issue and have a solution and just need time to implement it or if they need time to figure our the cause of the issue. He said it’s the latter. So, as far as I can tell, Softr has not determined what’s wrong. Hence the indefinite time-table for resolution. Aramayis may have more relevant information. Thank you!

I will sync with Aramayis tomorrow.

1 Like

@dmytro in your case you might need to either disable user cache or alternatively use the filter a bit inverted instead of relying updated value in user try to apply the filter on static user field e.g. email and use the linked fields user-link…

@bbelo the same logic would work for you too, instead of saying Video Ask Name is not User's Video ask try Video ask -> user-email is not User's email

this way you can even keep the user cache

Well, I have discussed it with the support and their conclusion was to disable caching.

I didn’t get in full the second solution you proposed as if field is static - then there is nothing to wait for updating :slight_smile: - the problem is exactly that each student sees his/her personal content (like there are even 20 lessons assigned to each student, maybe even different sets; however, currently he/she sees Lesson number 3, cause he/she just accomplished Lesson number 2, and another Student sees some other content, based on his/her studying roadmap and current performance) and the main way to get this changeable variable in Softr - is via the Users record, as not much is available in Conditional filters, either User or fixed value.

While writing this I had an idea that sometimes we could also try to convert the page into details page (and filter on details record), however, this is definitely not a way for a starting page, like I have in my case.

So far disabling User Cache based on the Support advice definitely helped.

Thanks, anyway.

I am having trouble getting the call-api-success to work. My code is:

<script>
window.addEventListener('update-record-success-contractlist', () => {
    window.dispatchEvent(new CustomEvent('reload-block-list6'));
        window.dispatchEvent(new CustomEvent('reload-block-list7'));
  });

window.addEventListener('update-record-success-policylist', () => {
    window.dispatchEvent(new CustomEvent('reload-block-list6'));
        window.dispatchEvent(new CustomEvent('reload-block-list7'));
  });
 
window.addEventListener('block-loaded-list4', () => {
    window.addEventListener('call-api-success-list4', () => {
        setTimeout(() => {
            window.dispatchEvent(new CustomEvent('reload-block-list6'));
        }, 2000); 
    });
});

</script>

The first two listeners work and refresh the blocks. The last one doesn’t. The blocks contractlist, policylist and list4 are the new grid blocks and list6 and list7 are normal list blocks.

I would be super grateful for any help.

I am using the one click update function:

I’ve tried to use the listener with ‘new blocks’ to refresh ‘new blocks’ and the
new blocks do not refresh.

Using the same listener with ‘new blocks’ to refresh ‘old blocks’ does work.

window.addEventListener(‘block-loaded-list-1’, () => {
window.addEventListener(‘update-record-success-list-1’, () => {
setTimeout(() => {
window.dispatchEvent(new CustomEvent(‘reload-block-list-2’));
}, 4000);
});
});

1 Like

@MattBell @MarkSchofield
The problem comes from the call-api-success event listener, for the case of Matt. @artur

the listener with ‘new blocks’ to refresh ‘new blocks’ and the
new blocks do not refresh. => there is an event listener update about it => Refresh specific block after one-click update - #16 by matthieu_chateau

2 Likes

Perfect, thank you @matthieu_chateau

Thank you @matthieu_chateau and @artur

1 Like

This is incredible. Thanks for this!!

1 Like