Library yang digunakan adalah select2 Full Versi 4
Select2 adalah javascript library yang paling banyak digunakan untuk menampilkan daftar pilihan, dimana dengan select2 kita dapat mencari pilihan yang kita inginkan
Select2 memperbolehkan kita untuk membuat nilai baru atau kata baru yang tidak ada dalam daftar pilihan dropdown (Saat mendeklarasikan select2, opsi tags harus true, dan opsi placeholder diperlukan)
Contoh :
Daftar pilihan select2 adalah daftar item yang memiliki iditem dan nama item yang sama sebagai berikut
var daftarItem=[
{'id': 'Minyak', 'text': 'Minyak'},
{'id': 'Sabun', 'text': 'Sabun'},
{'id': 'Kopi', 'text': 'Kopi'}
];
Daftar tersebut adalah daftar item dalam database kita
Lantas bagaimana kita mengetahui apakah user memilih item baru atau item yang sudah ada dalam pilihan tersebut ?
Berikut ini adalah kode untuk mendeteksi apakah nilai select2 belum ada dalam daftar pilihan
function select2_NotInList() {
var opt = $(this).val();
var length = $(this).children("option").not("[data-select2-tag='true']").filter(function () {
return $(this).val() === opt;
}).length;
if (length != 0) {
return false
} else {
return true
}
};
var newdata=false;
//catatan : select id pilihan sudah dideklarasikan sebagai select2
$('#pilihan').on("change",function(){
if($(this).val()==""){newdata=false;return} //tidak diproses jika nilai kosong
if($(this).val()==null){newdata=false;return} //tidak diproses jika nilai kosong
newdata=select2_NotInList.call($(this));
if(newdata){
alert("Pilihan baru")
}else{
alert("Pilihan ada dalam daftar")
}
});