Membuat Dropdown Select2 pada Framework Yii2


 

salam coding kawan!

MENAMBAH SELECT2 PADA TAG INPUT

pada kesempatan kali ini, saya ingin membagi pengalaman tentang mudahnya membuat dropdown select2 pada Yii2. saya asumsikan kawan-kawan sudah bisa menginstal Yii2, kawan-kawan bisa mencari di google bagaimana cara install Yii2 baik manual atau dengan composer. kawan-kawan bisa melihat refrensi lengkapnya di Yii2.

baik kita akan menggunakan Select2 Yii2 dengan memanfaatkan plugin dari kartik. langkah pertama buka terminal atau CMD anda bila anda menggunakan windows. kebutalan saya menggunakan linux ubuntu jadi pada demo kali ini fokus pada terminal linux.

"kartik-v/yii2-widget-select2": "@dev"

perintah diatas otomatis menambah plugin select2 pada folder vendor anda sekaligus pada composer.json. tunggu sampai proses download plugin selesai. Bila sudah selesai buka salah satu file view yang ingin anda tambahkan select2. pada contoh kali ini saya ingin membuat select2 pada data kabupaten milik saya. tambahkan baris perintah dibawah ini untuk memanggil plugin select2

use kartik\select2\Select2;

kemudian pada tag input anda rubah seperti perintah di bawah ini

  <?= $form->field($model, 'origin')->widget(Select2::classname(), [
           'data' => ArrayHelper::map(Kabkot::find()->all(), 'id', 'kabupaten_kota'),
          'options' => ['placeholder' => 'Cari Origin ...'],
          'pluginOptions' => [
              'allowClear' => true
          ],
          ]); ?>

maka otomatis tag input anda akan berubah seperti contoh dibawah ini

 

mudah kan?

MENAMBAH SELECT2 PADA FILTER CGRIDVIEW

ok kawan-kawan. bila kita tadi mengimplementasikan select2 pada tag input kita, kali ini kita akan implementasikan pada cgridview yii2 agar saat memfilter data kita bisa memanfaatkan select2, seperti pada gambar di bawah ini.

 

 

untuk membuat filter cgridview seperti di atas, buka file index.php pada folder view anda. ubah seperti koding dibawah ini.

<?= GridView::widget([
        'dataProvider' => $dataProvider,
        'filterModel' => $searchModel,
        'columns' => [
            ['class' => 'yii\grid\SerialColumn'],
            [
                'attribute' => 'origin',
                'value' => function($data) {
                    return $data->kabkot->kabupaten_kota;
                },
                'filter' => \kartik\select2\Select2::widget([
                    'model' => $searchModel,
                    'attribute' => 'origin',
                    'data' => ArrayHelper::map(Kabkot::find()->all(), 'id', 'kabupaten_kota')
                ]),
            ],
            [
                'attribute' => 'destination',
                'value' => function($data) {
                    return $data->kabkot2->kabupaten_kota;
                },
                'filter' => \kartik\select2\Select2::widget([
                    'model' => $searchModel,
                    'attribute' => 'destination',
                    'data' => ArrayHelper::map(Kabkot::find()->all(), 'id', 'kabupaten_kota')
                ]),
            ],
            'rate',
            'min_weight',
            'lead_time',
            'status',
            ['class' => 'yii\grid\ActionColumn'],
        ],
    ]); ?>

perhatikan pada koding di bawah ini

[
'attribute' => 'origin',
'value' => function($data) {
return $data->kabkot->kabupaten_kota;
},
'filter' => \kartik\select2\Select2::widget([
'model' => $searchModel,
'attribute' => 'origin',
'data' => ArrayHelper::map(Kabkot::find()->all(), 'id', 'kabupaten_kota')
]),
],

nilai yang di ambil pada attribute origin berelasi dengan data kabupaten yang tercantum pada code return $data->kabkot->kabupaten_kota; untuk bisa mengambil data berelasi seperti ini pastikan anda sudah mengsetting pada Model anda. buka file Model anda, pada kesempatan kali ini saya menggunakan Model Retail yang berelasi dengan Model Kabupaten. tambahkan function seperti di bawah ini :

public function getTblKecamatans()
    {
        return $this->hasMany(TblKecamatan::className(), ['kabkot_id' => 'id']);
    }

mudah bukan?

baik terima kasih untuk kunjungannya, bila ada kesulitan anda bisa bertanya pada kolom komentar.

 

SALAM CODING!

2 thoughts on “Membuat Dropdown Select2 pada Framework Yii2

  1. I have noticed you don’t monetize your page, don’t waste your traffic,
    you can earn additional bucks every month because you’ve got high quality content.
    If you want to know how to make extra bucks, search for:
    Mertiso’s tips best adsense alternative

Leave a Reply

Your email address will not be published. Required fields are marked *