CODEWITHSUNDEEP
javascriptjquery
King Kong
King Kong

Reputation: 2915

$(this) is not working

I am using ColorPicker Plugin. I initialized the plugin with following code :

$(".colorpic").ColorPicker({
    color: '#0000ff',
    onShow: function (colpkr) {
        $(colpkr).fadeIn(500);
        return false;
    },
    onHide: function (colpkr) {
        $(colpkr).fadeOut(500);
        return false;
    },
    onChange: function (hsb, hex, rgb) {
        $(this).css('backgroundColor', '#' + hex);  <= $(this) not working 
    }
});

Now my problem is that $(this) is not working in onchange event. Help me out please?

Upvotes: 7

Views: 214

Answers (2)

FabioCosta
FabioCosta

Reputation: 2749

The this is a really big problem, since in this case the this goes to the function if I am not mistaken. Try the following:

var colorPicker=this;
onChange: function (hsb, hex, rgb) {
    $(colorPicker).css('backgroundColor', '#' + hex); 
}

Upvotes: 3

Mariusz Jamro
Mariusz Jamro

Reputation: 31643

Try like this:

$(".colorpic").each(function(){
    var $this = $(this);

    $this.ColorPicker({
        color: '#0000ff',
        onShow: function (colpkr) {
            $(colpkr).fadeIn(500);
            return false;
        },
        onHide: function (colpkr) {
            $(colpkr).fadeOut(500);
            return false;
        },
        onChange: function (hsb, hex, rgb) {
            $this.css('backgroundColor', '#' + hex);
        }
    });
});

Upvotes: 9

Related Questions