combox dinamis chekbox combobox

https://select2.github.io/
http://achmatim.net/2013/07/15/jquery-multiple-select-combobox-untuk-tampilan-combobox-yang-lebih-baik/

       Using Select2 from a CDN

Select2 is hosted on both the cdnjs and jsDelivr CDNs, allowing you to quickly include Select2 on your website.

  1. Include the following lines of code in the <head> section of your HTML.
    <link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
    <script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
    
    Immediately following a new release, it takes some time for CDNs to catch up and get the new versions live on the CDN.
  2. Initialize Select2 on the <select> element that you want to make awesome.
    <script type="text/javascript">
      $('select').select2();
    </script>
    
  3. Check out the examples page to start using the additional features of Select2.
  4.      




JQuery Multiple-Select Combobox untuk Tampilan Combobox yang Lebih Baik

http://achmatim.net/2013/07/15/jquery-multiple-select-combobox-untuk-tampilan-combobox-yang-lebih-baik/


Combobox atau Selecbox merupakan salah satu komponen penting dari form inputan. Melalui jenis inputan ini, normalnya pengguna dapat memilih satu pilihan yang ditampilkan dalam bentuk drop-down. Namun dengan menambahkan atribut multiple, maka pengguna juga dapat memilih lebih dari satu pilihan sekaligus. Pada jenis combobox dengan pilihan tunggal memang pengguna rata-rata cukup nyaman dengan bentuk dasarnya, namun pada bentuk jamak (multiple-select combobox), pengguna seringkali tidak terlalu nyaman karena dalam memilih beberapa pilihan sekaligus harus menekan tombol Ctrl. Sedangkan tidak semua pengguna memahami hal tersebut.

multi-select-04
Dalam tutorial ini, dibahas mengenai bagaimana memanfaatkan Plugin JQuery Multiple-Select untuk membuat penampilan combobox menjadi lebih nyaman dan lebih mudah dari sisi pengguna. Plugin Jquery Multiple-Select yang akan kita gunakan mengharuskan penggunaan library JQuery versi 1.7.0 ke atas. Plugin ini memiliki beberapa fitur unggulan (seperti dikutip dari situs resminya) sebagai berikut:
  • Secara default akan menampilkan pilihan combobox dalam bentuk checkbox.
  • Mendukung pilihan group (optgroup).
  • Dapat menampilkan beberapa item sekaligus dalam sebuah baris.
  • Terdapat pilihan “Select all”
  • Terdapat pilihan placeholder.
Plugin ini juga dapat dijalankan di berbagai browser modern, seperti IE 7+, Chrome 8+, Firefox 10+, Safari 3+ dan Opera 10.6+.

Download Library JQuery dan Plugin JQuery Multiple-Select

Sebelum mencoba contoh-contoh program dalam tutorial ini, kita harus mendownload library JQuery dan plugin Multiple-Select di link berikut ini:
  1. Download versi terakhir JQuery di laman http://code.jquery.com
  2. Download Plugin JQuery Multiple-Select di halaman http://wenzhixin.net.cn/p/multiple-select atau http://plugins.jquery.com/multiple.select/

Subscribe to receive free email updates:

0 Response to "combox dinamis chekbox combobox"

Post a Comment