Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Class names can't contain spaces #832

Open
mokhosh opened this issue Feb 29, 2020 · 5 comments · May be fixed by #907 or #1074
Open

Class names can't contain spaces #832

mokhosh opened this issue Feb 29, 2020 · 5 comments · May be fixed by #907 or #1074
Labels
bug

Comments

@mokhosh
Copy link

mokhosh commented Feb 29, 2020

Describe the bug
You can't add multiple classes and separate them with spaces. This is what you get:

Uncaught (in promise) DOMException: Failed to execute 'add' on 'DOMTokenList': The token provided ('bg-gray-200 p-1') contains HTML space characters, which are not valid in tokens

So you can't style this with tailwind. Or keep the original class and add a bootstrap class to it. The strange thing is you can do this for container and containerOuter but nothing else.

To Reproduce
Steps to reproduce the behavior:

new Choices(element, {
  itemSelectText: '',
  removeItemButton: true,
  classNames: {
    containerOuter: 'choices bg-gray-200 focus:bg-gray-100 focus:shadow shadow-inner appearance-none rounded w-full text-gray-700 leading-tight',
    containerInner: 'py-1 px-3',
    input: 'bg-gray-200 p-1',
  },
});
@mokhosh mokhosh added the bug label Feb 29, 2020
@aswinmohanme
Copy link

Can confirm.

@nicobaguio
Copy link

Can confirm as well (using tailwind).

@hsleewis
Copy link

Anyone found a workaround for this?

@abishekrsrikaanth
Copy link

abishekrsrikaanth commented Jul 3, 2020 •
edited

anybody gave a fix for this. It looks like this issue is for only certain classes and not all of them.

I face this issue when I add multiple classes to list, itemSelectable, listDropdown

Another issue that I have is that it doesn't append to the existing styles, it just replaces the existing styles.
I use the base css of the plugin and want to use my own styles, so I was hoping they will append the classes to the class= attribute. I am hoping this is fixed as well.

@Matth10 Matth10 mentioned this issue Aug 12, 2020
Closed
8 tasks
@BariqDharmawan
Copy link

Is this still a bug? Bcz I try to add class with space to placeholder but it return a same error as the question

@mtriff mtriff mentioned this issue Dec 22, 2021
Closed
@mtriff mtriff linked a pull request Dec 22, 2021 that will close this issue
Added multi class functionality #907
Open
8 tasks
@mtriff mtriff mentioned this issue Dec 23, 2021
Closed
@gaetan-hexadog gaetan-hexadog linked a pull request Nov 20, 2022 that will close this issue
Open
10 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug
Projects
None yet
Milestone
No milestone
6 participants
@hsleewis @abishekrsrikaanth @mokhosh @nicobaguio @aswinmohanme @BariqDharmawan