Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Set up "reactive properties" for form fields #273

Closed
bob2517 opened this issue Aug 9, 2022 · 3 comments
Closed

Set up "reactive properties" for form fields #273

bob2517 opened this issue Aug 9, 2022 · 3 comments
Assignees
Labels
docs done The documentation has been fully completed for this issue done on branch This issue has been committed to the latest branch, and will get merged with the next release enhancement New feature or request
Milestone

Comments

@bob2517
Copy link
Member

bob2517 commented Aug 9, 2022

Currently, putting a reactive variable in an input field, doing some typing and then changing the reactive variable, doesn't update the property of the input field. It only changes the attribute - not what you can see.

But if you don't change the value property by typing, changes to the value attribute, via a reactive variable, does update the property. It's a bit niche, but that's what the browser does.

I can't think of a valid reason why you wouldn't want the property to change also if you specifically set up a reactive variable for the value attribute.

So I think it would be good to also change the property of an input field if the attribute changes as a result of an changed reactive attribute. This wouldn't violate existing behaviour, because the browser doesn't natively support reactive variables yet, and you would specifically have to set it up in the code anyway. As I say, I can't think why you would want to update the value of an input field dynamically without also updating the value property.

This would mean that CRUD forms would, in scenarios set up to utilise this behaviour, be easier to write and require less mark-up. So here's the issue for it.

@bob2517 bob2517 added enhancement New feature or request proposal I've got a great idea! crazy idea This is a crazy idea but it might be amazing! labels Aug 9, 2022
@bob2517 bob2517 self-assigned this Aug 9, 2022
@bob2517
Copy link
Member Author

bob2517 commented Aug 10, 2022

For example, in an SPA, let's say there is a pre-rendered form, hidden or displayed, and you are making a fresh JSON call to fetch data for one record. ACSS automatically converts JSON data to variables. When the JSON is received, one assignment from the JSON variable to a defined form variable object could update all the details in the form without having to do anything else, in addition to the display fields.

The form fields can then be shown when the edit button is clicked on, the regular display fields disappear - the input fields reshow, and voila, you have an accurate form ready to be submitted. That is a more scalable solution than any vdom technique, as you are only dealing with record data and variable placeholders in the DOM.

It does require that you are in control of the JSON to control field structure, but it would be weird if you weren't.

It would not work with forms that have a potentially different field structure for each form, without some other logic in there, and it may be simpler just to draw a form in that scenario, but those types of form tend to happen less frequently.

@bob2517
Copy link
Member Author

bob2517 commented Dec 18, 2023

This is now being handled as an either/or. If the attribute being updated is named "value" then it sets the property and not the attribute. Otherwise the attribute itself is changed. In theory there should be a slight performance improvement if using reactive variables with value attributes due to no visible rendering needed when updating, and won't affect ajax-form-submit or a regular form submit which has always used the value property and not the attribute value.

@bob2517 bob2517 added this to the 2.16.0 milestone Dec 18, 2023
@bob2517
Copy link
Member Author

bob2517 commented Dec 18, 2023

Now on branch. Closing pending release.

@bob2517 bob2517 closed this as completed Dec 18, 2023
@bob2517 bob2517 added done on branch This issue has been committed to the latest branch, and will get merged with the next release docs done The documentation has been fully completed for this issue and removed proposal I've got a great idea! crazy idea This is a crazy idea but it might be amazing! labels Dec 18, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
docs done The documentation has been fully completed for this issue done on branch This issue has been committed to the latest branch, and will get merged with the next release enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

1 participant