Question

I’ve got a jPicker installed and running fine; its a pretty sweet script.

However, the value it returns to my input box is 8 digit hex. I need it to return 6 digit hex.

Rather than post-process the 8 digit into 6, I’d rather just hack into the script and force 6 digit. Alternately, I’d be ok with hooking into the change event of the jPicker to intercept the value its sending to the input element and doing the conversion there just before it updates the input with the hex.

Here’s my code:

$(function() {
    $('#myThemeColor').jPicker(); /* Bind jPicker to myThemeColor input */
    $("#carousel").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev",
        visible: 6,
        speed: 700
    });

And here’s the code I’m working with to intercept the myThemeColor input’s change event, but its not firing at all.

$('#myThemeColor').change(function()
    {
alert(this.val()); /* does not fire on any action */)
    if($(this).val().length == 8)
        {

        $(this).val(function(i, v) 
            {
                return v.substring(0, 6); 
            });
        }
    });

Answer 1

Using the callback like this will do it if you’re using an input:

$('#myThemeColor').jPicker({}, 
   function(color) { $(this).val(color.get_Hex()); },
   function(color) { $(this).val(color.get_Hex()); });
);

This will grab the hex value and set the value to that when you hit Ok and live as you change it in the picker. Take off the second function if you don’t want it to be live.