Closed francisrupert closed 6 years ago
@bignamehere,
Action
Pull before you next work on feature/select-multi
branch to avoid conflict mayhem.
Background
As part of adjusting disabled form elements (#189), I had to account for this component's disabled equivalent too. It was easier to do so by merging my working branch to feature/select-multi
and adjusting.
I'm completely out of this branch now. So once you've completed the indeterminate
feature, we'll likely move to develop
right quick.
@francisrupert
I need a second set of eyes on this issue. I have tried a number of ways to try and replicate the jQuery example, but am having issues traversing back up the ancestry nodes to turn indeterminate to checked. I have committed my code here.
Can you take a look and see if you can spot what I am missing.
FYI:
I have turned off the Select All capabilities because they will need to be rewritten with this new logic.
I have added a --tiered class that gives more max-height for nested input trees. Needs CSS help later.
@bignamehere,
While the multi-tiered nested example you're attempting will be a good use case to make available at some point, don't kill yourself to get that working for now. Concentrate on the flat use case.
Solidify the below use case, and then create a new issue (referencing this issue) that addresses a multi-tiered example set for a future milestone.
Nothing is selected
[ ] Select all
[ ] Apple Pie
[ ] Cherry Pie
[ ] Peach Pie
Checking "Cherry Pie" results in indeterminate "Select all"...
[-] Select all
[ ] Apple Pie
[x] Cherry Pie
[ ] Peach Pie
Checking "Select all" when in indeterminate state will uncheck all
[ ] Select all
[ ] Apple Pie
[ ] Cherry Pie
[ ] Peach Pie
Checking "Select all" when none are checked
[x] Select all
[x] Apple Pie
[x] Cherry Pie
[x] Peach Pie
Unchecking "Cherry Pie" when all are checked results in indeterminate "Select all"
[-] Select all
[x] Apple Pie
[ ] Cherry Pie
[x] Peach Pie
@francisrupert
I rebuilt the code for the Select Multi with the Select All feature. Based on my research of various examples online, I believe we should not have the Select All checkbox uncheck all when in the Indeterminate state. There are a few UX and technical reasons as well, including that being counter intuitive to the label "Select All". Gmail is the only example I saw that used this behavior, but their pattern does not include any labels at all. To be honest, the Gmail implementation seems rather confusing.
Let's discuss further when you have some time.
@francisrupert
For reference, here are the examples I looked at:
Example that talks about behavior of indeterminate state.
closing as per 705e9ce
Reopening. Noticed a bug in IE.
Task
fsa-style
, namespace, any adjustments, etc.disabled
, what else?.pcp-select-multi__check
are checked, the "Select all" checkbox is indeterminate. DS Reference.PCP Prototype: https://sharepoint....component_select-multi.html