select2 multiselect with checkbox and without checkbox on the same page
I'm using the select2 multiselect with checkbox from this example:
https://codepen.io/lenamtl
The problem is that when I set it up for my multiple select dropdowns, it overrides my regular that don't require checkboxes that are on the same page, because changes require that I override the default select2 css settings.
Is there a way to keep both the dropdown with the checkbox and the dropdown without the checkbox when it's not a multiselect?
Has anyone dealt with this?
thanks!
https://codepen.io/lenamtl
The problem is that when I set it up for my multiple select dropdowns, it overrides my regular that don't require checkboxes that are on the same page, because changes require that I override the default select2 css settings.
Is there a way to keep both the dropdown with the checkbox and the dropdown without the checkbox when it's not a multiselect?
Has anyone dealt with this?
thanks!
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Norie,
No, I have select2 for single select on the same page with the multi select. I only want the multiselect to have the checkboxes.
Lenamtl,
The page is mixed with single select and multi select. I only want the multi select to have the checkboxes. Looks like this is your code! :)
Can you give me an example of how to do the custom css to the specific id? I don't understand what is happening on that options page and how I would use that.
Would it be too much to ask if you created a codepen with two on the page. One single select without checkboxes and the one with?
thanks!
No, I have select2 for single select on the same page with the multi select. I only want the multiselect to have the checkboxes.
Lenamtl,
The page is mixed with single select and multi select. I only want the multi select to have the checkboxes. Looks like this is your code! :)
Can you give me an example of how to do the custom css to the specific id? I don't understand what is happening on that options page and how I would use that.
Would it be too much to ask if you created a codepen with two on the page. One single select without checkboxes and the one with?
thanks!
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Here are the two methods that are used:
Looking at your code, it uses the keyword multiple:
Can those lines, which are unique to the multiple, have the "multiple" added to fix this? Is that an option?
thanks!
.select2-results__option:before {
.select2-results__option[aria-selected=true]:before {Looking at your code, it uses the keyword multiple:
.select2-selection .select2-selection--multiple:after {Can those lines, which are unique to the multiple, have the "multiple" added to fix this? Is that an option?
thanks!
ASKER
I'm also looking up themes to see how to create a theme, and I find nothing in the select2 search results other than the command you mentioned.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Do you mean you want to use the same CSS for other multiselect dropdowns but without the checkbox?