Skip to content Skip to sidebar Skip to footer

JPicker Set Color

I'm using jPicker plugin to get a color from a picker. I create the element in this way: $(function(){ $('#txtBackgroundColor').jPicker(

Solution 1:

Setting the value

var control= $('#txtBackgroundColor')
var colorPicked = '#e2ddcf';
control.jPicker({
   color: { active: colorPicked}
});
control[0].color.active.val('hex', colorPicked);
control.val(colorPicked.replace("#", ""));

Dependent on your scenario some of the lines above may be irrelevant.

Finding the ID if:

$('#txtBackgroundColor')

is incorrect look for the span with jPicker class on it like this

<span class="jPicker">

Just above that, there should be an input with a display style of none with an ID value. Use that one in the above example.


Solution 2:

You're syntax wasn't right. Fixed it.

You could use .each() to target each element like this:

$(function() {
$('#txtBackgroundColor').each(function() {
    $(this).jPicker({
        color: {
            mode: 'h', // acceptable values "h" (hue), "s" (saturation), "v" (brightness), "r" (red), "g" (green), "b" (blue), "a" (alpha)
            active: new $.jPicker.Color({
                hex: 'eaeaea'
            }), // accepts any declared jPicker.Color object or hex string WITH OR WITHOUT '#'
        },
        window: {
            position: {
                x: 'screenCenter', // acceptable values "left", "center", "right", "screenCenter", or relative px value
                y: '200px', // acceptable values "top", "bottom", "center", or relative px value
            },
            expandable: true
        },
    })
});

});


Post a Comment for "JPicker Set Color"