Autocomplete pada form input YII

Autocomplete pada form input YII

Sugik-info.blogspot.com - Catatan Kecil. Pada kali ini saya akan berbagi cara untuk membuat fitur autocomplete ala google dengan menggunakan Widgets CJuiAutoComplete. Kurang lebih screenshotnya seperti pada gambar berikut ini:

Screenshot dari penerapan Autocomplete pada form input Yii

Langkah pertama:
Buka File Controller Anda
seperti contoh berikut ini:
public function actionAutocomplete()
{
$res =array();

            if (isset($_GET['term'])) {
                    $qtxt ="SELECT nip from tb_pegawai WHERE nip  LIKE :nip
                            ORDER BY nip ASC"; 
                    $command =Yii::app()->db->createCommand($qtxt);
                    $command->bindValue(":nip", $_GET['term'].'%', PDO::PARAM_STR);
                    $res =$command->queryColumn();
            }

            echo CJSON::encode($res);
            Yii::app()->end();
}

/////////////////////
Masih pada File Controller Anda
Tambahkan nama function pada rule

public function accessRules()
{
return array(
array('allow',  // allow all users to perform 'index' and 'view' actions
'actions'=>array('index','view','duplikasi', 'autocomplete'), //duplikasi adalah metode untuk mecegah data kembar
'users'=>array('@'),
),
array('allow', // allow authenticated user to perform 'create' and 'update' actions
'actions'=>array('create','update','admin','autocomplete'),
'users'=>array('@'),
),
array('allow', // allow admin user to perform 'admin' and 'delete' actions
'actions'=>array('admin','delete','autocomplete'),
'users'=>array('admin'),
),
array('deny',  // deny all users
'users'=>array('*'),
),
);
}

Langkah Kedua:
Buka File _Form.php
Edit seperti skrip dibawah ini:

<div class="row">
<?php echo $form->labelEx($model,'nip'); ?>
<?php 
$this->widget('zii.widgets.jui.CJuiAutoComplete', array(
'model'=>$model,
'attribute'=>'nip',
'value'=>$model->nip,
'name'=>'nip',
'source'=>$this->createUrl('Autocomplete'), //memanggil function pada controller anda
// additional options for the autocomplete plugin
'options'=>array(
'minLength'=>'2',
),
'htmlOptions'=>array(
'style'=>'width: 200px;',
'placeholder' => 'NIP'
    ),
));

?>
<?php echo $form->error($model,'nip'); ?>
</div>

Selesai.

Semoga catatan kecil ini dapat sedikit membantu Anda.

Semangat...

Tweet