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-checkbox

    Images:
    OS browser - 0_1527880451176_checkboxstates.png
    iOS webview - 0_1527880256764_indeterminateCheckboxes.png


  • Onsen UI

    @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.


Log in to reply