Bootstrap-select: Dropdown with country flag img

[ghost]

How I can to drop select option with img icon. exp. countries flag.
Similar http://js.nicdn.de/bootstrap/formhelpers/docs/country.html
Thx,

[ghost]

Any ideas? I didn't like use data-content... Maybe know another solution?

[krystyna93]

I am looking for the same solution. Any one have ideas?

[elmapaul]

Mee too

[caseyjhol]

Any particular reason you don't want to use data-content?

[Aqsathemes]

find this code:

if (!$this.data('content')) { // Prepend any icon and append any subtext to the main text. text = icon + '<span class="text">' + text + subtext + '</span>'; }

and replace it with:

if ($this.data('thumbnail')) { // Prepare thumbnail text = '<span class="media">' + '<span class="media-left"><img src="' + $this.data('thumbnail') + '" class="media-object" onerror="src=\'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\'"></span>' + '<span class="media-body">' + text + '</span>' + '</span>'; } else if (!$this.data('content')) { // Prepend any icon and append any subtext to the main text. text = icon + '<span class="text">' + text + subtext + '</span>'; }

usage:

<select title="Select your surfboard" class="selectpicker"> <option>Select...</option> <option data-thumbnail="images/icon-chrome.png">Chrome</option> <option data-thumbnail="images/icon-firefox.png">Firefox</option> <option data-thumbnail="images/icon-ie.png">IE</option> <option data-thumbnail="images/icon-opera.png">Opera</option> <option data-thumbnail="images/icon-safari.png">Safari</option> </select>