update yii listview onchange of dropdown

Question

I want to change pagesize of listview using dropdown. please help me to find solution. I have read many article but not able to do this. can u find where I'm making mistake

I'm using following code.

code for index.php (view)

code for dropdownlist

  <?php echo CHtml::beginForm(); ?>
            <?php echo CHtml::dropDownList('CategoryMst_pagesize','20',
                    array('10'=>'10','20'=>'20','50'=>'50','100'=>'100'
                    ),
                    array('class'=>'form-control',
                    /*'ajax'=>array(
                        'type'=>'GET',
                        'data'=>array('pagesize'=>'js:this.value'), 
                        'ajaxUpdate':()
                    ),*/
                ));
            ?>
            <?php echo CHtml::endForm(); ?> 

code for listview

 <?php $this->widget('zii.widgets.CListView',array(
            'id'=>'category_list',
            'dataProvider'=>$dataProvider,
            'itemView'=>'_view',
            'summaryText'=>'{start} - {end} of {count} results',                
       ));
 ?>



  <?php 
    Yii::app()->clientScript->registerScript('category_update',
        "$('#CategoryMst_pagesize').change(function(){
              $.fn.yiiListView.update('category_list', {
                   data: $(this).serialize(),
              }
          );
         });
         return false;",
    CClientScript::POS_READY);
?>

code in cotroller

      public function actionIndex($pagesize=20)
{
    $dataProvider=new CActiveDataProvider('CategoryMst',array(
                'criteria'=>array(
                ),
                'pagination'=>array(
                    'pageSize'=>$pagesize,
                ),
            ));

    $this->render('index',array('dataProvider'=>$dataProvider));        
} 

Answer 1

You really should not be using $('#CategoryMst_pagesize').change use https://api.jquery.com/on/ instead.

Then from what I see you are not remembering the page size anywhere, after you change it 1 time, as soon as you go to another page it will revert back to what you had before. THis is how I do it:
1) First use something to remember the page size, because right now you do not. I personally recommend this one http://www.yiiframework.com/extension/esaverelatedbehavior/ as it is really, really, really good. It also remember your filters (priceless). 2) create a function for your controller that will just save the page size.

/**
 * Saves the new page size for this particular model
 */
public function actionPageSize($pagesize)
{
    \Yii::app()->user->setState($this->modelName() . '_pagesize', $pagesize);
}

3) create the dropdown for the pagesize, I use Select 2 but you can use a normal dropdown. same Idea

    <?php $this->widget('MySelect2', array(
        'name' => 'pageSize',
        'data'=>array('10' => '10', '25' => '25', '50' => '50', '100' => '100'),
        'options'=>array('allowClear' => false, 'minimumResultsForSearch' => 30),
        'htmlOptions' => array(
            'data-ajax-dropdown' => $this->createUrl('pageSize'),
            'style' => 'width: 80px',
            'options'=>array(
                (Yii::app()->user->getState($this->modelName() . '_pagesize', Yii::app()->params['defaultPageSize']))=>array('selected'=>'selected')
    ))));?>

4) I autosubmit the dropdowns for the page size like you do, but I submit them to the function above not to the index page

/*==========================
AUTOSUBMIT DROPDOWNS FOR THE PAGE SIZE
==========================*/
$('#pageSize').live('change',function(e){
    var element = $(this);
    jQuery.ajax({
        "type": "GET",
        "url": $(this).attr("data-ajax-dropdown"),
        "cache": false,
        "data":{pagesize: $(this).val()}
    })
    .success(function ( response ) {
        $.fn.yiiGridView.update(element.closest('.widget.table').find('div.grid-view').attr('id'));
        $.jGrowl("Pagination changed", { life: 2000 });
    });    
});

PS: I know I should not use .live

5) In the search for the model just like you do I have

return new \CActiveDataProvider($this, array(
    'criteria'=>$criteria,
    'sort'=>array(
        'defaultOrder'=>$this->getTableAlias(false,false) . '.name asc',
    ),
    'pagination'=>array(
        'pageSize'=> \Yii::app()->user->getState(get_class($this) . '_pagesize', \Yii::app()->params['defaultPageSize']),
    ),                  
));