从Boostrap中排除元素以选择实时搜索

Question

I am using bootstrap select with live search and I would like to have an element always visible. Example:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script> <select data-live-search="true" class="selectpicker"> <option>mustard</option> <option>ketchup</option> <option>relish</option> <option data-divider="true"></option> <option>Add new</option> </select> 

I would like the "Add new" option to always be shown (before searching and after searching with and without results found). I couldn't find any way to do this. The approach I am considering is to manually append an element to the list using Javascript when the load event is triggered.

Answer 1

If you are using CDN, then its quite impossible in my case to make you understand how to do this.

Other than, if you are using its JS & CSS file from local, then there is some configuration in JS file ie if no option is there then it will show "Nothing Selected". You can search for the Particular text and can Change from there.

Because of its a plugin, you can't customize it completely.

Its not the best answer, but it might help you