CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrap
Marco Gurnari
Marco Gurnari

Reputation: 159

Uncaught TypeError: Object [object Object] has no method 'colorpicker'

Yesterday I was using the bootstrap color picker: http://www.eyecon.ro/bootstrap-colorpicker/

The simple HTML code is:

<link rel="stylesheet" href="vendor/colorpicker/css/colorpicker.css">

    <div class="colorpicker" id="yellow">
        <a href=""></a>
    </div>

<script src="vendor/colorpicker/js/colorpicker.js"></script>

The js is:

$ ('. colorpicker'). colorpicker ()

Unfortunately I do not have any effect because the console in google chrome gives me this error:

 Uncaught TypeError: Object [object Object] has no method 'colorpicker'

I do not understand what is causing this error.

Upvotes: 1

Views: 1160

Answers (2)

Mike Emery
Mike Emery

Reputation: 837

I just ran into this and wanted to contribute my 'fix':

jquery was included twice

Upvotes: 1

bansi
bansi

Reputation: 57052

Assuming you are having this code in $(document).ready(function() {

$ ('. colorpicker'). colorpicker ()

should be 

$('.colorpicker').colorpicker()

Or the full code

$(document).ready(function() {
   $('.colorpicker').colorpicker();
} );

Edit: This is the page i tested and it is working.

<html>
<head>
<link href="http://www.eyecon.ro/bootstrap-colorpicker/css/colorpicker.css" rel="stylesheet"/>
<link href="http://www.eyecon.ro/bootstrap-colorpicker/css/bootstrap.css" rel="stylesheet"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">  </script> 
<script src="http://www.eyecon.ro/bootstrap-colorpicker/js/bootstrap-colorpicker.js">  </script> 

<script>
$(document).ready(function () {
    $('.colorpicker').colorpicker();
});
</script> 

</head>
<body>
    <input class="colorpicker" id="yellow" />

</body>
</html>

Note: basic colorpicker needs the element to be type input.

Upvotes: 8

Related Questions