Bootstrap colorpicker valeur de couleur initiale

Question

J'utilise bootstrap colorpicker mais mon exigence est de changer la couleur de chargement par défaut différemment lors du changement de la liste déroulante de sélection.

J'utilise le constructeur ci-dessous: -

$('#colorPicker').colorpicker(); 

C'est le code dans jsp.

<div id='colorPicker'> 
<input type='text' value='#ea0437' class='form-control'/> 
<span class='input-group-addon'></span> 
</div> 

Je reçois le code couleur de la base de données que je ne peux pas ajouter le code de couleur initiale indiquée ci-dessus dans la ligne suivante:

<input type='text' value='#ea0437' class='form-control'/> 

Comment puis-je fournir cette couleur dans le constructeur? La documentation indique qu'il existe une option de couleur, mais aucune démonstration donnée. Comment puis-je fournir la couleur au départ? Quelque chose comme ceci:

$('#colorPicker').colorpicker({ 
color : '#ea0437' 
}) 

Une suggestion? Merci d'avance.

Answer 1

I got mine de travailler après plusieurs jours de l'essayer. Il semble qu'un événement onchange ait été attaché au champ de saisie colorpicker, mais ne soit pas déclenché après avoir défini la valeur via le script. Par conséquent, vous devez le déclencher manuellement, comme ceci:

$("#inputcolor").val("#bbccff"); 
$("#inputcolor").trigger('change'); 

Answer 2

Il a fonctionné pour moi avec ce code:

$('#colorPicker').colorpicker(document.getElementById('inputcolor'),'#ea0437'); 

Je viens de donner l'entrée de l'identifiant « inputcolor » puis l'obtenir avec getElementById.

EDIT:

Que diriez-vous d'attribuer une valeur à l'entrée lors du chargement de documents complètement, puis le colorpicker choisir, donc ce sera comme une couleur par défaut.

Voici le nouveau code:

$(document).ready(function(){ 
    $('#inputcolor').val('#ccc'); 
}); 
    $('#colorPicker').colorpicker(); 

Il y a tellement de problèmes avec cette bibliothèque, vous pouvez jeter un oeil sur les problèmes dans leur github.

Voici la nouvelle Fiddle

Answer 3

Utilisez les deux ensemble. Il travaillera

$('#inputcolor').colorpicker({color : "Your_color"}) 
` $('#inputcolor').colorpicker('setValue', "Your_color")