<html lang="en">
<head>
<title>Jquery Select2 - Select Box with Search Option</title>
<script src="ajax.googleapis.com/.../jquery.js"></script>
<link href="cdnjs.cloudflare.com/.../select2.min.css" rel="stylesheet" />
<script src="cdnjs.cloudflare.com/.../select2.min.js"></script>
</head>
<script type="text/javascript">
var data = [{
id: 0,
text: 'enhancement',
html: '<div style="color:green">enhancement</div>'
}, {
id: 1,
text: 'bug',
html: '<div style="color:red">bug</div><div><small>This is some small text on a new line</small></div>'
}];
function template(data) {
return data.html;
}
$("select").select2({
data: data,
templateResult: template,
escapeMarkup: function(m) {
return m;
}
})
</script>
<body>
<select class="myselect" style="width:500px;">
</select>
</div>
<script type="text/javascript">
$(".myselect").select2();
</script>
</body>
</html>
*This post is locked for comments