AJAX validation in search - yii

Question

I am new to Yii, I have two tables. master_customer,master_client. In the client model, in the view I have a search box, If I enter a few letters in the search box, it must automatically get the data and give results from master_customers(like google suggestions). I have made relations in the client model with the master_customer.
please help me with the code. Thanks in advance
CONTROLLER action:
public function actionIndex()
{
$criteria = new CDbCriteria();
if(isset($_GET['q']))
{
$q = "%".$_GET['q']."%";
$criteria->condition = 'cust_name='.$q;
$arrTier3 = MasterCustomers::model()->findAll($criteria);
//$criteria->compare(MasterCustomers::model()->cust_name,$q, true);
//$criteria->compare('$data->customers->cust_name', $q, true, 'OR');
print_r($arrTier3);
die();
}
$dataProvider=new CActiveDataProvider('Host', array('criteria'=>$criteria));
$this->render('index',array(
'dataProvider'=>$dataProvider,
));
}
view :
<!--Content-->
<div id="content">
<div style="padding: 10px;">
<a href="<?php echo $this->createUrl('/Controller/create');?>" title="Create New Host" class="btn btn-primary circle_ok" style="text-decoration: none;" >Add New Host to Customer</a>
<div style="float:right">
<?php
echo CHtml::link('Upload Customer CSV', array('/Controller/uploadCustomers'), array(
'onclick'=>'return hs.htmlExpand(this, { objectType: "iframe", wrapperClassName: "full-size", align: "center" } )',
'class'=>'btn btn-primary',
'id'=>'upload_link',
));
?>
</div>
</div>
<h3><?php echo $title; ?></h3>
<div class="innerLR">
<div class="row-fluid">
<?php
$obj=$this->widget('zii.widgets.grid.CGridView', array(
'dataProvider'=>$dataProvider,
//'afterAjaxUpdate'=>'\'changeTRColor()\'',
//'itemView'=>'_view',
'columns'=>array(
array( // display 'create_time' using an expression
'name'=>'name',
'value'=>'$data->host_name',
),
array(
'name'=>'serviceId',
'value'=>'$data->host_serviceid',
),
array(
'name'=>'customer',
'value'=>'$data->customers->cust_name',
),
array(
'class'=>'CButtonColumn',
'template'=>'{delete}{update}',)
),
));
?>
<form method="get">
<input type="search" placeholder="search" name="q" value="<?=isset($_GET['q']) ? CHtml::encode($_GET['q']) : '' ; ?>" />
<input type="submit" value="search" />
</form>
</div>
<div class="separator bottom"></div>
</div>
</div>
<!-- // Content END -->
<div class="clearfix"></div>
<!-- // Sidebar menu & content wrapper END -->
<div id="footer" class="hidden-print">
<?php $this->renderPartial('application.views.layouts._footer_inc'); ?>
</div>

Answer 1

If you need a search like google that searches on each key press and update GridView then you can try like this. In your javascript write
<script type="text/javascript">
$(document).ready(function () {
$('#id of your search box').keyup(function () {
$.fn.yiiGridView.update('id of your grid to be updated', {
data: $(this).serialize()
});
});
});
</script>
In your controller check the $_POST variable that what value it has, so you can grab that value and search in master_customers for that specific value and render the view again.