ui icon indicating copy to clipboard operation
ui copied to clipboard

Multiline Field Enhancements

Open acicovic opened this issue 5 years ago • 4 comments

Hi guys, I have started using the Multiline control and it is useful. I think that there are several enhancements that could be made in order to improve its user experience. Most of those could be added as an option. Sorry for the long post but I think those are important.

  • [x] 1. New line when tabbing in last column on last record Why: Currently the control is hard to use if I want to add 40 entries. We have to go to the + button on the bottom right and press it 40 times. But as the button moves, it is hard to use.~~ Details: When user presses tab in the last column of the last row, open up a new line automatically, equivalent to pressing the + button.

~~2. Add-only mode~~ ~~Why: One of the excellent use cases for Multiline is mass insertion of records. When user does a mass insert, they might not be interested in seeing existing records. In fact, showing records on that scenario could be cumbersome (user needs to go to the end of the list etc).~~ ~~Details: Give the option to not display the existing records in the Multiline for add-only mode.~~ (retiring suggestion 2 as it would not be good for usability according to @ibelar and @PhilippGrashoff)

  • [ ] 3. Toolbar and button position enhancements Why: Currently the toolbar moves up or down when we add/delete, having to move the mouse up/down for consequent operations. Buttons at the bottom right end of the screen might not be very user friendly in some cases (for example large monitors). Details: Give the option to have the toolbar on the top (no more toolbar moving) and to align the buttons on the left instead of the right.

  • [ ] 4. Improve delete experience Why: Current implementation is ideal for deleting most of the dataset (which is usually rare), but In all other cases it is a bit tiring requiring extra clicks and mouse movements. For example if I want to delete something at the start of a long list, I have to click the checkbox and then scroll all the way down to press the delete button. Details: Add a delete button on each row that will allow the user to delete the specific record with a single click, right on the spot.

  • [ ] 5. Start with a blank line option Why: In most cases users will add data to the Multiline, so going to click the + button in those cases is an extra step. Details: Add an option to start the Multiline with an empty row when it gets rendered

  • [ ] 6. Add minimum rows option Why: In some cases you want to enforce the number of minimum records. Will allow us to implement ContainsOne/HasOne using Multiline. Details: Add an option for minimum rows like we have for maximum rows right now.

  • [ ] 7. @PhilippGrashoff MultiLine suggestion for controls within MultiLine to behave as regular ATK UI controls : #810

Closing I think that those enhancements will very much increase the user friendliness of the control as well as its use cases, by giving more capabilities to developers and a more user friendly control for users. Is anyone willing to tackle any of those? @ibelar you're the obvious candidate but I know this might be a lot. For me the most important would be item 1. From an ATK standpoint, I think that 6 makes sense as important functionality.

Related issues/PRs: #784, #754, #816, #810

acicovic avatar Oct 05 '19 09:10 acicovic

Hi,

good to see I am not the only one working with multiline.

Regarding 1 and 3): I personally do not like the idea that a new record is added by tab key. This is very different to normal form behaviour, where tab is used to jump to the next input.

  • Where does the focus currently jump to when pressing tab at last row last column? The add button would be a good place, then just pressing enter should add a new record. However, as buttons are not using

PhilippGrashoff avatar Oct 05 '19 17:10 PhilippGrashoff

Thanks for your comments on improving MultiLine.

@acicovic Regarding your points.

1 - make sense to me, I can look into it. 2- Sorry but I do not agree with this one. First, when user add an entry, it will need to get validate, requiring a trip to the server, this mean it would not be different from a regular form entry. Plus I do not think hiding entries would be good for a user stand point. 3- The reason why button are at the bottom is for the user to see that an actual row is added. Imagine that when you are adding a long list of record and rows goes past the bottom of the screen, thus when user click the plus button, he would not see the newly added row if button is on top. 4- Reason why there is no delete button on each row was to differentiate MultiLine from a Table or Grid. Adding the delete button can be done, but then we would need to add a confirmation dialog asking the user if he is really sure. This way, confirmation is done when user tick the check mark prior to delete the record. 5- Reason why it does not start with a blank line is that containsOne and containsMany can be set to null in db, thus saving record without containsOne or containsMany value. In those situation, having a blank record would required user to delete it prior to save form when model defining the containsOne or containsMany fields has required validation in it. 6- This should be done when user Save form. Then, you can check how many rows has been entered by the user and respond with an error notifier. (May be I can hook form-error in there as well). Has off now, Multiline cannot prevent the form from submitting when user click Submit.

Hope this help clarify about MulltiLine Input field. Let me know your thoughts.

ibelar avatar Oct 06 '19 18:10 ibelar

Hi guys, thank you for your valuable time and input, I really appreciate it. Apologies for the long post!

1

@PhilippGrashoff Regarding this point, a + button on top is indeed better than current situation although it still adds a burden. So does the repeated tab and enter to add new rows. I get your point regarding tabstops although in my experience not many users go for the tab key in order to focus buttons. In contrast, many users accustomed to data entry programs using datagrid or spreadsheet type controls use tabs to add new rows to their table or go to the next line (although they are admittedly mostly desktop apps).

So I propose to implement this as an option so everyone can decide what's best in their specific scenario. Perhaps we could go even further and be able to specify another key combo (for example ctrl+enter) for adding new lines while keeping tab functionality. But for now, just a simple on/off switch for special tab mode would be enough for me. This option should be off by default, this way nothing breaks and everybody gets the behavior they want. Would you be OK with this?

2 + 3

@ibelar I'm not sure I understand what you're saying about the server, but I'll have to think about it and I understand that it's a limited use case. @PhilippGrashoff you are right about having the old input and I like how you approached this with the new record on top, and perhaps this could be a solution. But according to @ibelar, 3 is implemented this way so the user can see the row addition at the bottom (which is logical).

Perhaps we can do something like "when toolbar on top add new entry on top, when toolbar on bottom, add new entry on bottom. @ibelar do you think that this would be OK? this way new entry is always near the new button and user can see the new record.

4

@ibelar OK, no problem. My proposal wasn't to discard the current system anyway, just to add the button as well because I find it more user friendly. This is not a dealbraker anyway so we can leave as is and reconsider it if more people ask for it, or add it as an on/off option.

5

@ibelar OK, agreed

Thank you for all the work, this is great stuff!

acicovic avatar Oct 06 '19 19:10 acicovic

Item 1 was implemented in PR #816 (Add option to create new line entry when tabbing out of last record)

ibelar avatar Oct 26 '19 16:10 ibelar