Which is better onsubmit or onchange in terms of speed to db postgresql?

hi i have this app with lots of inputs and queries

client may change everything, should i use onsubmit event when press enter or onchange? which one is faster in terms of speed, perfomance.

Im using a postgresql db. I cant do much as they have almost 15 queries for all this inputs, as they have data in one table, another in a second table and so on (they come from access)

I think you might be confusing things here - there's no difference in speed of the query to the database of those browser events but there are differences in when they are triggered by the app and how often they are triggered.

onSubmit will occur when the user presses Enter (but they may not have changed the value)
onChange will occur every keypress

To know which is "better" I think we'd need to know what your use case is and how you intend the user to make changes.

I am presuming that when the user completes a change it will trigger an update query to your database. If you expect them to change many fields at one time then this could trigger multiple updates at the same time which I would be cautious about. So what you need to be clear on is what is a "completed change" and when do you need to update the database.

In any case you will need to consider how many queries you are triggering and how often, as well as making sure the user knows those updates are happening, eg by disabling the field until the update is complete.

1 Like

How i disable field until is updated? Well the app as you see have many fields, i can have 10 users changing 10 diff clients in db, maybe i can put submit on all of then instead of onchange so they should press enter if i leave onchange it will change automatically to the db every time they are writing

Or maybe have a separate button so save all changes ? Not sure if that’s possible to only change the “changed” fields onclick button

You could capture the changes as they happen using onChange into a temporary variable and when the user hits "save" you can save just those changes in one transaction

Fields can be disabled based on the query isFetching property - so the save action will prevent the user making more changes until it's completed

what you recommend me? right now i have all fields onChange directly to db, i mean is fast, but with 1 user, im thinking 10 users at the same time with diff clients

can you give me an example? i mean, i know how to save a variable but when i hit save button, how i apply just those changes to my db postgres? js, transformer? not sure

even with 1 user, firing a database query every keypress is going to be very heavy and you should restrict it to when the changes have completed and the user either submits that field or many fields

If you had a temporary variable that holds all the changes as the user makes those changes, you can use this as the object in the update query. eg something like this:

That would update only the changed fields, it would only need 1 db query and db connection so should be less impact on your db server

1 Like

how you save two fields in one variable? so in all fields i should have a trigger onchage to save a variable? im confused if i have 30 fields, how i manage that

yes, absolutely you can - your variable can contain multiple data items, you can use setValue or setIn - here's an example:

forum.json (19.7 KB)

1 Like

so on each input i need to put that onchange and then use that to fire after save button is pressed? and whats the diff between set in and set value?

i tried like this

but is not saving with set in

the intial value of your variabled needs to be an empty object, in the example I set my variable to {}

The difference between setValue and setIn is this:

myvar.setValue('hello world') => "hello world"
myvar.setIn(['greeting'],'hello world') => {greeting: "hello world"}

setIn allows you to set a value in a deep nested path but setValue just sets it to a single value

if you capture the changes in this variable you will have a change object that you can use as the data for your update query - if your fields have the same id as the columns they are updating then you won't need a transformer or any data manipulation either, you can use the variable value as it is :slight_smile:

1 Like

awesome, works good. thank you for that tip

1 Like