Implementing autosave in my app

Hi there,

I’m working on a CRUD page where the user will spend a long time on the page (e.g. 30 mins). It is being used during a phone call to capture call notes.

I would like to implement auto-save on this page to allow the system to automatically save every X seconds so that the user doesn’t accidentally page away after spending 30 mins on the phone and loses all their notes.

What is the best way to implement auto-save on a form page?

Thanks

1 Like

To do something every X seconds you would use a Timer Component:

If you are having your client user log into something using the users service, I would implement some sort of users service indexed with a data table strategy:

If you are not going to implement that a user needs to log in and have a permanent id then you might use the browser cashe, sessions, or cookies for short-medium term storage.

Also, :wave: Welcome to anvil!

2 Likes

You can use the events of the input components to start a timer. For example when a text area changes or a checkbox is clicked, their event will do self.auto_save_timer.interval = 1.

Then get the self.auto_save_timer.tick event to make the server call to save the current content and disable the timer with self.auto_save_timer.interval = 0.

This will save after one second after each burst of changes. Often enough that you don’t miss anything, but not so often that you save after every user interaction with the form components, like every keystroke on a text area.

3 Likes

It sounds like it may also be helpful to put this line in your native libraries:

<script>window.onbeforeunload=function(){return "Close?";}</script>

That helps to keep users from unintentionally backing out or clicking away from the current URL, in most browsers.

3 Likes

My apps are all based on the routing module of Anvil Extras, and I do that with the set_warning_before_app_unload function.

1 Like

Cool, I’m curious, is there any special functionality there to work uniformly across all browsers?

I don’t know, but considering that this line explicitly mentions chrome, I’m going to guess that it has been tested across browsers.

1 Like

Just came across Anvil Extras and it looks like a really useful library. Was looking for an autocomplete and found it in this library :slight_smile: