Notice: The Monaca & Onsen UI Community Forum is shutting down.
For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.
Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.
Indeterminate checkbox support in Onsen UI?
-
Question: ** Does Onsen UI support indeterminate (tri-state, multistate) checkboxes? **
I have a project in mind that requires indeterminate checkbox support iOS and Android. I have not found anything in the documentation or on the forums.
The best would be to display an indeterminate checkbox as a dash, which is what modern OS browsers do natively. There are other solutions, as some of my references show below, but they aren’t graphically consistent with the Onsen UI.
iOS native webview (Safari-class) support is buggy (outlined check with white fill when indeterminate and checked are set for the checkbox), but I’d prefer support in the UI css for consistency.
On Android, UC browser support isn’t there, though Android Chrome supports it just as in the OS app. So UI-level support is probably also necessary here.
Below are examples, descriptions, and other solutions re indeterminate checkbox states…
References:
https://css-tricks.com/indeterminate-checkboxes/
https://medium.com/@zxlee618/indeterminate-checkboxes-on-ios-safari-ed723a1920d9
https://lokesh-coder.github.io/pretty-checkbox/#states
https://caniuse.com/#feat=indeterminate-checkboxImages:
OS browser -
iOS webview -
-
@tcr Onsen UI doesn’t currently support indeterminate checkboxes. I didn’t realise that support for this had gotten so widespread. It is the kind of feature we will certainly add support for in the future, but I would be likely to wait until it is natively supported by iOS.