Cara menggunakan CHOICES.JS pada JavaScript

Jika Anda seorang pengembang web, lihat instruksi tentang cara memakai kode <noscript> pada halaman internet Anda.

Instruksi untuk pengembang web

Apabila anda ingin menyertakan tautan halaman ini, untuk menjelaskan setiap pengguna untuk mengaktifkan javascript dalam lima peramban web yang paling banyak digunakan. Anda bebas menggunakan kode dibawah ini dan memodifikasinya sesuai kebutuhan anda.

<noscript>
   Agar fungsi di situs ini lebih baik, anda perlu mengaktifkan JavaScript.
   Berikut ini adalah <a href="https://www.enable-javascript.com/id/">
   petunjuk cara mengaktifkan JavaScript</a> di peramban web Anda.
</noscript>

Pada enable-javascript.com kita mengoptimalkan pengguna yang belum mengaktifkan script sebanyak mungkin:

The instructions for your browser are put at the top of the page
All the images are inlined, full-size, for easy perusing
This developer-centric message is out of the way.

Kami ingin pengunjungmu untuk mengaktifkan JavaScript seperti kamu!

Search disini terdapat didalam form select option jadi saat diklik pada select maka akan muncul sebuah fungsi search didalamnya. Maka dari itu fungsi search tidak harus selalu muncul atau terlihat pada tampilan, jadi dalam kasus ini tampilan search ini akan sangat membantu saat pencarian jika data pada select terlalu banyak. Baiklah bagaimana sih cara membuat search didalam select option yuuuk perhatikan cara pembuatannya sebagai berikut.

Langkah pertama buatlah file HTML untuk struktur dasarnya seperti code dibawah ini:

<h2>Membuat Search di Select Option</h2>

<option value="Codeigniter">Codeigniter</option>

<option value="FuelPHP">FuelPHP</option>

<option value="PhalconPHP">PhalconPHP</option>

<option value="Silex">Silex</option>

<option value="CakePHP">CakePHP</option>

<option value="Symfony">Symfony</option>

<option value="Laravel">Laravel</option>

<option value="Lumen">Lumen</option>

</select>

</div>

nah pada select option saya memberikan beberapa data untuk dipilih, sebelumnya pada tag head berikan library JQuery dan plugin select2 coba perhatikan code berikut

<!DOCTYPE html>

<head>

<title>Membuat Search di Select Option Dengan Jquery</title>

Selanjutnya ketikkan script dibawah ini yang digunakan dalam jquery:

$(".theSelect").select2();

</script>

Jika sudah simpan filenya lalu kita sahabat lihat tampilannya pada browser masing-masing apakah seperti tampilan dibawah ini:

Demikian pembahasan kali ini tentang cara membuat search didalam select options, semoga bermanfaat dan sampai jumpa dengan pembahasan artikel lainnya,

terima kasih