Topic: Color
Expected behavior A fully functional color picker.
Actual behavior Not a functional color picker.
The color picker seem to be buggy (unusable).
Placing 2 color pickers on same page, the first one is almost working. It looks correct, but the is no response when adding an eventlistener. The second one has no marker (the little circle that you move around when picking the color).
When removing the input boxes none of the pickers works.
Adding just one picker as a "dropdown" (A button that opens the picker) - then there is no marker (the little circle that you move around when picking the color).
Also: I need to be able to turn off alpha.
Thanks, John
Grzegorz Bujański staff answered 4 years ago
In fact, this event is not triggered. We are sorry for that. We will fix it as soon as possible.
Macjohn commented 4 years ago
OK. Thanks.
And is it possible to turn off all of the controls, except for the color picker it self? I just need my users to be able to pick a color, which I will pass to a hidden input, via the eventListener. The user does not need to see the HEX or the RGB. And the user does not need to add RGB or HEX. And does not need to set Alpha. So I would like to completely hide the controls. Is that possible?
Grzegorz Bujański staff answered 4 years ago
At the moment it is not possible to turn off the alpha slider. You can disable other sections:
<div class="color-picker"
data-mdb-color-picker-change-format-btn="false"
data-mdb-color-picker-copy-icon="false"
data-mdb-color-picker-color-inputs="false"
data-mdb-picker="color-picker"
></div>
But we will be adding this option in the future. For now you can hide it with CSS:
.color-picker #alphaRange {
display: none;
}
Macjohn commented 4 years ago
OK cool, thanks.
Is there an estimated time frame on the eventListener bug?
Grzegorz Bujański staff commented 4 years ago
Unfortunately, at the moment I am not able to give an estimated time
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB Standard
- MDB Version: 3.2.0
- Device: Any
- Browser: Any
- OS: Any
- Provided sample code: No
- Provided link: No
Grzegorz Bujański staff commented 4 years ago
Can you send a code that doesn't work for you? Note that we added a few color pickers in the documentation and they all work.
Macjohn commented 4 years ago
As dropdown. This gives me a color picker, when clicking the button. But there is no response from the event listener. Also the little circle that is supposed to mark the position on the color picker is not showing.
const pickerText = document.querySelector('.service-color');
pickerText.addEventListener('onChange.mdb.colorPicker', () => { console.log("test"); });
Macjohn commented 4 years ago
UPDATE:
If I use the class .color-picker insetad of .service-color - then the little circle marker shows. But there is still no response from the event listener.