Topic: MDB Color Picker and AJAX
We are using the MSDB Color Picker on one of our pages. The section of the page that contains the color picker is reloaded with an ajax call, so the HTML is replaced. When the ajax call completes, we do attempt to initialize the color picker. The picker does display, but the image is incorrect and sometimes the rest of the page does not load. It is not working at all. Note that there could be multiple pickers on the page. How can we reload the color picker using an Ajax call? Note we are using Bootstrap 4. Thanks, -Rich
Here is our init of the color pickers:
function InitColorPickers() {
$('.hscolor-picker').each(function()
{
const color_picker_control = new Pickr({
el: '#'+this.id,
useAsButton: true,
default: "303030",
components: {
preview: true,
opacity: false,
hue: true,
interaction: {
hex: true,
rgba: false,
hsla: false,
hsva: true,
cmyk: false,
input: true,
clear: false,
save: true
}
},
onSave(hsva) {
AjaxPost("action=control&ccindex="+ccindex+"&ref="+colorref+"&color="+hsva.toHEX().toString(),"devices.html");
}
});
});
}
Grzegorz Bujański staff answered 3 years ago
To see what is happening we need an example for which this error occurs. Please add the full code (including HTML) that will help us reproduce this problem.
Helmke pro premium answered 3 years ago
Thanks for the reply. I changed my code so when the color button is pressed it calls a javascript function that then creates the color picker and shows it. That has fixed my problem. -Rich
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: No
- Technology: MDB Standard
- MDB Version: MDB5 3.9.0
- Device: PC
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: No