Most efficient way to toggle read-only state for Form Components

Hello Backenders! I am using the Form Component, so there’s a data binding to Page Data.

Then on the Page scope, I have the property “readOnly”.

Now, in order for the various input components within the Form to respond to the readOnly setting, I would do:
Screenshot 2023-10-03 at 12.53.13

This is fine, except it’s a bit tedious. Is there a more efficient way to do this?

Incidentally, I have also tried to set the variable within the “form” level. This then allows me to specify it directly like so:
Screenshot 2023-10-03 at 12.57.54

But it has a few downsides:

  • every time I load new data to the form, the readOnly value will be over-written, so an additional line is then added to set readOnly to true. This results in the field flashing briefly from one state to another.

  • When the Form data is saved using standard Backendless Data API components, I would need to take the additional step to parse out these extra UI State field.

None of the above is a deal breaker, so I am purely wondering if there’s a more elegant way to propagate UI states to child data containers.

Hello @Bob_Leung

Unfortunately, I don’t know more variants to handle it in a more convenient way. If you can propose one, we will take it into account.

Regards, Dima.

Thanks @Dima_Vak1 . If I were to propose one, then I think it could be a UI efficiency issue rather than a technical one. Therefore I have the following thought:

  1. It would be awesome if I can bind the value to property in a parent scope without having to add a logic, e.g.:
    Screenshot 2023-10-03 at 15.32.41

  2. If it’s possible to select multiple elements on the UI and then doe item (1), that would be the ultimate.

Hope these are not completely stupid ideas :sweat_smile: