Yii color picker change event issue

Question

I'm using minicolors color picker for Yii and I want to attach a change event on the color picker input as always:

$('#color_picker').change(function(e) { console.log('It works!') });

But it doesn't work, then I tried:

$('#color_picker').miniColors({change: function(hex, rgb) { console.log('It works!') }});

This doesn't work either. Considering docs I should attach this event on creation, but why? What if I need to attach it after creation, can this be done?

Answer 1

You have been missing the left-right parenthesis { } for the supplied options , here is what is described on official document

$(selector).minicolors({
    change: function(hex, opacity) {
        console.log(hex + ' - ' + opacity);
    }
});

Edited (1):

<input id="general_bgColor" type="text">
<script>
    $(function(){
        $('#general_bgColor').miniColors({ change: function(hex, rgb) { console.log('it worked!'); //console.log(hex + ' - ' + rgb); } });
    })
</script>

Edited (2): Here is what you should add using that Yii extension

$this->widget('ext.widgets.SMiniColors.SColorPicker', array(
    'id' => 'myInputId',
    'defaultValue'=>'#000000',
    'hidden'=>false, // defaults to false - can be set to hide the textarea with the hex
    'options' => array(
        'change' => 'js:function(hex, rgb) { console.log(hex + " - " + rgb); }'
    ), // jQuery plugin options
    'htmlOptions' => array(

    ), // html attributes
));

Notice my line option 'change' . I think the single quote on your function string inadvertently make invalid array. It makes the option key 'change' always has value '0'