The ability to edit multiple fields at the same time can sometimes be a superpower that reduces tens of manual edits into one. This experiment is about giving your users that ability, with a minimal development effort.
Applications that mean business are often data-intensive and can involve a lot of entering, verifying, and modifying data. These applications are often used by professionals to get their work done, sometimes throughout the whole workday.
When tasks get repetitive, there is an opportunity for us as software developers to aid the user, and improve the user experience. By doing so, we can not only minimize the number of errors made, but we can also improve efficiency, and ultimately improve the workday for the users that may be using our applications all day long.
By bringing some of the editing power from spreadsheets and code editors to arbitrary forms, we can potentially improve everyone’s workday – sometimes by a little, sometimes by a lot.
This experiment combines several features, but perhaps the most important feature is the near-zero implementation effort: in this demo, one single orchestration component (a LitElement based WebComponent) is added to each form, instantly enabling the multi-editing functionality:
-
Select (or deselect) multiple fields (ctrl/cmd-click)
-
Range-select multiple fields (shift-click)
-
All selected fields reflect edits
-
Undo (all multi-selected fields revert to initial state)
-
Spreadsheet-compatible copy & paste, retaining the “shape” of the data.
We feel this experiment already shows potential, but as always the devil is in the detail and not all cases need the same configuration. Please try the demo, and let us know what you think!
Especially if you already have a specific use-case in mind: please let us know, so that we can work together to bring this idea to life!