What is the best practice/process for "update on blur"

Wappler General Need Help
1

I’ll try to keep this simple. I am creating a repeating form which might have, say, ten repeating lines. On each line are 6 input fields.

Rather than one ‘Save’ button for the whole form, or a ‘Save’ button for each line, I want the user to enter an input field, change the data, and then on ‘blur’ ie when tabbing or clicking away from the input field, that input field data is updated in the database.

I know that if there are changes to every input field, that would result in 60 update calls to the database.

How would you setup the API Server Action?
Would you still do one API Database Update, or would you do six, one for each input field?
Have you had any issues in doing what I propose?

2

This may help

2 Likes
3

Hi @UKRiggers, I have recently developed a budget and forecast module that utilises a similar ‘Save’ process.

Instead of dmx-on:blur, I have setup dmx-on:changed.debounce:1000 dynamic event to submit the server connect form. The debounce delay allows the user time to enter the value before triggering the form submit. This is an example of the code:

<input class="form-control form-control-sm text-end input-budget" 
id="budget_qty_jul" name="budget_qty_jul" aria-describedby="budget_qty_jul_help" 
type="number" data-rule-number="" 
dmx-on:changed.debounce:1000="scf_budget_update.submit()">

scf_budget_update is the name of the server connect form being submitted that contains the required IDs and input values to be updated. I am also notifying the user via the form submit success event when a value has been saved. This provides user a visual confirmation that the value has been saved correctly in the database.

There’s one API server action. In my case, there are 12 input fields for each month. I’m updating values for all 12 months in the database. If the user has entered a value, then that value is saved, otherwise I am saving the value as 0 by adding default(0) to the posted value.

3 Likes
4

That’s great Brian, I would not have found that, Cheers.

5

That’s just the sort of snippet and advice I was looking for, thanks.

1 Like
6

for info @UKRiggers, the issue with actions set as “on change” firing on page load mentioned 27 mins into video should now be resolved since the update of Wappler 6 beta 4 making it a really good option