victor-valencia / bootstrap-iconpicker

A simple icon picker
https://victor-valencia.github.com/bootstrap-iconpicker/
MIT License
381 stars 138 forks source link

Custom iconset, empty first icon: console error #46

Closed ajanini closed 7 years ago

ajanini commented 8 years ago

Hello. I think I found an issue. I am using a custom iconset with an empty first icon (empty string), as follows:

$('#mypicker').iconpicker({
    iconset: {
        iconClass: 'icomoon',
        iconClassFix: '',
        icons: [" ", "icon-youtube", "icon-linkedin", "icon-pinterest"],
    },
});

When I click the button to open the icon picker, the following shows up in the console:

Uncaught Error: Syntax error, unrecognized expression: i.    jquery-1.11.0.min.js:2
db.error              @ jquery-1.11.0.min.js:2
ob                    @ jquery-1.11.0.min.js:2
db                    @ jquery-1.11.0.min.js:2
n.fn.extend.find      @ jquery-1.11.0.min.js:2
Iconpicker.switchPage @ bootstrap-iconpicker.js:171
(anonymous function)  @ bootstrap-iconpicker.js:476
n.event.dispatch      @ jquery-1.11.0.min.js:3
r.handle              @ jquery-1.11.0.min.js:3
n.event.trigger       @ jquery-1.11.0.min.js:3
e.event.trigger       @ jquery-migrate-1.2.1.min.js:2
(anonymous function)  @ jquery-1.11.0.min.js:3
n.extend.each         @ jquery-1.11.0.min.js:2
n.fn.n.each           @ jquery-1.11.0.min.js:2
n.fn.extend.trigger   @ jquery-1.11.0.min.js:3
r                     @ bootstrap.min.js:6
b.show                @ bootstrap.min.js:6
(anonymous function)  @ bootstrap.min.js:6
n.extend.each         @ jquery-1.11.0.min.js:2
n.fn.n.each           @ jquery-1.11.0.min.js:2
a.fn.popover          @ bootstrap.min.js:6
(anonymous function)  @ bootstrap-iconpicker.js:480
n.event.dispatch      @ jquery-1.11.0.min.js:3
r.handle              @ jquery-1.11.0.min.js:3

Is there a proper way to add an empty icon? What am I doing wrong? I'm using version 1.7.0.

victor-valencia commented 7 years ago

Hello @ajanini .

Corrections:

1.- Use iconClass = '' 2.- Use iconClassFix = 'icon-' 3.- Use '' place of ' ' for empty string. 4.- Use icons = ['', 'youtube', 'linkedin', 'pinterest'],

$('#mypicker').iconpicker({
    iconset: {
        iconClass: '',
        iconClassFix: 'icon-',
        icons: ['', 'youtube', 'linkedin', 'pinterest'],
    },
});

Don't forget include your .css file of iconmoon.

I write a demo to describes this example with fontawesome in this Fiddle.

Regards.