CGridView + search + an ajaxSubmitButton: 2 AJAX calls.

Hello folks,

I have the code below. As you can see, I have a CGridView inside a CActiveForm, and there’s also an ajaxSubmitButton there. The problem is: when I do a search with the CGridView’s integrated field search, two AJAX calls are thrown: a GET for the search and a POST for the ajaxSubmitButton, leading to undesired results (the search results are shown but shortly after they are replaced by the response of the ajaxClose action called on the POST). How can I prevent the POST action to be called when the CGridView calls the search action? Thanks in advanced.

My code:


<?php

  $form = $this->beginWidget('CActiveForm', array(

      'id'=>'whois-form',

      'enableClientValidation'=>true,

      'enableAjaxValidation'=>false,

   ));

?>

<div id="divGrid">

<?php

$this->widget('zii.widgets.grid.CGridView', array(

	'id' => 'whois-grid',

	'dataProvider' => $model->search(),

	'filter' => $model,

   'showTableOnEmpty' => false,

   'selectableRows' => 2,

   'ajaxUpdate'=>true,

   'pager'=>array(

      'cssFile'=>false,

   ),

	'columns' => array(

      array(

         'name' => 'user',

         'header'=>'Full name',

         'value' => '$data->user->fullName',

      ),

      array(

         'class' => 'CDataColumn',

         'name' => 'start_date',

         'type'=>'html',

         'header' => 'Start date',

         'value' => '$this->grid->getController()->df->formatDateTime($data->start_date, "short", null)',

      ),

      array(

         'class' => 'CDataColumn',

         'name' => 'last_date',

         'type'=>'html',

         'header' => 'Last seen',

         'value' => '$this->grid->getController()->df->formatDateTime($data->last_date, "short", null)',

      ),

      'ip',

		array(

        'id' => 'chbox_sessions',

        'value' => '$data->id',

        'class' => 'CCheckBoxColumn',

        'header' => 'Delete',

      ),

	),

));

?>

</div>

<?php

   echo CHtml::ajaxSubmitButton(

           'Terminate marked sessions',

           array('/security/whois/online/ajaxClose'),

           array(

               'type' => 'post',

               'update' => '#divGrid',   

           ));

?>

You have to apply this patch:


Index: assets/gridview/jquery.yiigridview.js

===================================================================

--- assets/gridview/jquery.yiigridview.js   	(revisión: 332)

+++ assets/gridview/jquery.yiigridview.js   	(copia de trabajo)

@@ -41,6 +41,18 @@

                    	}

 

                    	var inputSelector='#'+id+' .'+settings.filterClass+' input, '+'#'+id+' .'+settings.filterClass+' select';

+           			$('body').undelegate(inputSelector, 'keydown').delegate(inputSelector, 'keydown', function(k){

+        	if (k.keyCode == 13) {

+   			var data = $(inputSelector).serialize();

+   			if(settings.pageVar!==undefined)

+              	data += '&'+settings.pageVar+'=1';

+   			$.fn.yiiGridView.update(id, {data: data});

+   			return false;

+        	}

+        	else {

+   			return k;

+        	}

+           			});

                    	$('body').undelegate(inputSelector, 'change').delegate(inputSelector, 'change', function(){

                            	var data = $(inputSelector).serialize();

                            	if(settings.pageVar!==undefined)

This prevents the container form to be submitted if you press enter on a filter text field, and, instead, it updates the grid, as if the field was changed.