code not taking input dynamically #241
Description
`<!doctype html>
<title>Add options dynamically to bootstrap-select</title> <style type="text/css"> .dropdown-menu { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }.dropdown-menu a {
overflow: hidden;
outline: none;
}
.additem input
{
border:0;
margin:-3px;
padding:3px;
outline: none;
color: #000;
width: 99%;
}
.additem:hover input
{
background-color: #f5f5f5;
}
.additem .check-mark
{
opacity: 0;
z-index: -1000;
}
.addnewicon {
position: relative;
padding: 4px;
margin: -8px;
padding-right: 50px;
margin-right: -50px;
color: #aaa;
}
.addnewicon:hover {
color: #222;
}
</style>
Add options dynamically to bootstrap-select
ADDING LABELS
Select Columns
Mustard Ketchup RelishSelect Type
Banana Peach Orange
©
<script src="http://code.jquery.com/jquery.js"></script>
<script src="js/bootstrap.js"></script>
<script src="plugins/bootstrap-select/js/bootstrap-select.js"></script>
<script>
$(function() {
var content = " ";
var divider = $('')
.addClass('divider')
.data('divider', true);
var addoption = $('')
.addClass('additem')
.data('content', content)
$('.selectpicker')
.append(divider)
.append(addoption)
.selectpicker();
});
function addSelectItem(t,ev)
{
ev.stopPropagation();
var txt=$(t).prev().val().replace(/[|]/g,"");
if ($.trim(txt)=='') return;
var p=$(t).closest('.bootstrap-select').prev();
var o=$('option', p).eq(-2);
o.before( $("", { "selected": true, "text": txt}) );
p.selectpicker('refresh');
}
function addSelectInpKeyPress(t,ev)
{
ev.stopPropagation();
// do not allow pipe character
if (ev.which==124) ev.preventDefault();
// enter character adds the option
if (ev.which==13)
{
ev.preventDefault();
addSelectItem($(t).next(),ev);
}
}
</script>
`
please help me with this code