Select2 merupakan component menggunakan jQuery yang digunakan untuk menggantikan dropdown yang reguler. Dengan Select2, terdapat kolom untuk search item yang memudahkan kita untuk memilih item yang berada di dalam select. Langkah 1 – Siapkan Data Kita akan menggunakan data yang digenerate oleh mockaroo.com dan saya simpan di tabel dengan nama mockdatas kemudian buat model Mockdata.php Read more about Laravel Tips & Tricks – Select2[…]
Sekarang kita akan membuat DropDown Search dengan menggunakan tools yang disediakan oleh vendor kartik-v yaitu Yii2 Select2 Widget. 1. Install Yii2 Widget Select2 dengan memberikan perintah ini pada directory advanced :
|
1 |
$ sudo php composer.phar require kartik-v/yii2-widget-select2 "@dev" |
2. Modifikasi file _form.php yang berada di folder \backend\views\branches dengan menambahkan
|
1 |
<span class="pl-s1"><span class="pl-k">use</span> <span class="pl-c1">kartik\select2\Select2</span>;</span> |
dan copy paste dari web kartik :
|
1 2 3 4 5 6 7 8 |
<span class="pl-s1"><span class="pl-c1">echo</span> <span class="pl-smi">$form</span><span class="pl-k">-></span>field(<span class="pl-smi">$model</span>, <span class="pl-s"><span class="pl-pds">'</span>state_1<span class="pl-pds">'</span></span>)<span class="pl-k">-></span>widget(<span class="pl-c1">Select2</span><span class="pl-k">::</span>classname(), [</span> <span class="pl-s1"> <span class="pl-s"><span class="pl-pds">'</span>data<span class="pl-pds">'</span></span> <span class="pl-k">=></span> <span class="pl-smi">$data</span>,</span> <span class="pl-s1"> <span class="pl-s"><span class="pl-pds">'</span>language<span class="pl-pds">'</span></span> <span class="pl-k">=></span> <span class="pl-s"><span class="pl-pds">'</span>de<span class="pl-pds">'</span></span>,</span> <span class="pl-s1"> <span class="pl-s"><span class="pl-pds">'</span>options<span class="pl-pds">'</span></span> <span class="pl-k">=></span> [<span class="pl-s"><span class="pl-pds">'</span>placeholder<span class="pl-pds">'</span></span> <span class="pl-k">=></span> <span class="pl-s"><span class="pl-pds">'</span>Select a state ...<span class="pl-pds">'</span></span>],</span> <span class="pl-s1"> <span class="pl-s"><span class="pl-pds">'</span>pluginOptions<span class="pl-pds">'</span></span> <span class="pl-k">=></span> [</span> <span class="pl-s1"> <span class="pl-s"><span class="pl-pds">'</span>allowClear<span class="pl-pds">'</span></span> <span class="pl-k">=></span> <span class="pl-c1">true</span></span> <span class="pl-s1"> ],</span> <span class="pl-s1">]);</span> |
Ganti $data sehingga filenya menjadi Read more about Tutorial Yii2 Bagian 14 : Membuat DropDown Search Select2 Widget[…]