cgridview not filtering at all

Question

I googled everywhere and I just can't see what else am I missing? The filter on the top doesn't do anything. I think this is the default from crud, not sure. What else am I missing here though?

controller:

$model=new Product('search');
$model->unsetAttributes();  // clear any default values
if(isset($_GET['Product']))
    $model->attributes=$_GET['Product'];

$this->render('view',array(
    'model'=>$model,
));

model rules:

array('product_id, product_name,product_price, product_status, 'safe', 'on'=>'search'),

and view:

<?php $this->widget('zii.widgets.grid.CGridView', array(
    'id'=>'product-grid',
    'dataProvider'=>$model->search(),
    'filter'=>$model,
    'columns'=>array(
        'product_id',
        'product_name',
        'product_price',
        'product_status',

        array(
            'class'=>'CButtonColumn',
        ),
    ),
)); ?>

model search, pretty much the default

$criteria=new CDbCriteria;

    $criteria->compare('product_id',$this->product_id);
    $criteria->compare('product_name',$this->product_name);
    $criteria->compare('product_price',$this->product_price);
    $criteria->compare('product_status',$this->product_status);     
    return new CActiveDataProvider($this, array(
        'criteria'=>$criteria,
    ));

js

jQuery(function($) {

$('.search-button').click(function(){
    $('.search-form').toggle();
    return false;
});
$('.search-form form').submit(function(){
    $('#product-grid').yiiGridView('update', {
        data: $(this).serialize()
    });
    return false;
});

jQuery(document).on('click','#product-grid a.delete',function() {
    if(!confirm('Are you sure you want to delete this item?')) return false;
    var th = this,
        afterDelete = function(){};
    jQuery('#product-grid').yiiGridView('update', {
        type: 'POST',
        url: jQuery(this).attr('href'),
        success: function(data) {
            jQuery('#product-grid').yiiGridView('update');
            afterDelete(th, true, data);
        },
        error: function(XHR) {
            return afterDelete(th, false, XHR);
        }
    });
    return false;
});
jQuery('#product-grid').yiiGridView({'ajaxUpdate':['product-grid'],'ajaxVar':'ajax','pagerClass':'pager','loadingClass':'grid-view-loading','filterClass':'filters','tableClass':'items','selectableRows':1,'enableHistory':false,'updateSelector':'{page}, {sort}','filterSelector':'{filter}','pageVar':'Product_page'});
            App.setMainPage(true);
            App.init();
            App.setTableDetails(jsonDashboard);
});
/*]]>*/

Answer 1

Try inspecting this using firebug and check whether jquery is working or not.

Answer 2

While running a CGridView in yii it generates a jquery automatically at the bottom of the page for proper working of CGridView copy that script from browser it will not show you in the view so copy it from browser and paste it here. That jquery may be making some issue.