Yii Framework Forum: Update Gridview With Ajax When A Modal Form Close - Yii Framework Forum

Jump to content

Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Update Gridview With Ajax When A Modal Form Close question from begginer Rate Topic: -----

#1 User is offline   nath-0 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 81
  • Joined: 12-October 12
  • Location:switzerland

Posted 24 October 2012 - 04:50 AM

Hello,

I am trying tu update my gridForm when my modal form close.
I follow this tutorial :
http://www.yiiframew...eate-new-model/

here my code :


<?php
/* @var $this AdDroitController */
/* @var $model AdDroit */

$this->breadcrumbs=array(
	'Ad Droits'=>array('index'),
	'Manage',
);

$this->menu=array(
	array('label'=>Yii::t('app','Liste des droits'), 'url'=>array('index')),
	array('label'=>Yii::t('app','Créer un droit'), 'url'=>array('create')),

);

Yii::app()->clientScript->registerScript('search', "
$('.search-button').click(function(){
	$('.search-form').toggle();
	return false;
});
//$('.add-button').click(function(){
//	$('.add-form').toggle();
//	return false;
//});
//$('.cancel-button').click(function(){
//	$('.add-form').toggle();
//	return false;
//});
$('.search-form form').submit(function(){
	$.fn.yiiGridView.update('ad-droit-grid', {
		data: $(this).serialize()
	});
	return false;
});
");
?>
<?php // Yii::app()->language='en'; ?>
<h1><?php echo Yii::t('app','Les droits') ?></h1>



<?php echo CHtml::button(Yii::t('app','Rechercher'),array('submit' => $url,'class'=>'search-button')); ?>



<?php $this->widget('ext.bootstrap.widgets.TbButton', array(
	'label'=> Yii::t('app','Ajouter'),
    'size' => 'small',
	'type'=>'primary',
	'htmlOptions'=>array(
		//'data-toggle'=>'modal',
        'url'=>'#',
		'data-target'=>'#dialogPermission',
        'onclick'=>"{addPermission(); $('#dialogPermission').dialog('open');}" //'$("#myModal").dialog("open"); return false;',
	),
)); ?>

<div class="search-form" style="display:none">
<?php $this->renderPartial('_search',array(
	'model'=>$model,
)); ?>
</div>

<?php $this->beginWidget('zii.widgets.jui.CJuiDialog', array(
    'id'=>'dialogPermission',
    'options'=>array(
        'title'=>'Create permission',
        'autoOpen'=>false,
        'modal'=>true,
        'width'=>600,
        'height'=>250,
        'close'=> 'js: function(event, ui){ window.location = "'.Yii::app()->createUrl($this->route).'";}',
   ),
   )); ?>
<div class="divForForm"></div> 

<?php $this->endWidget(); ?>


<script type="text/javascript">
// here is the magic
function addPermission()
{
    <?php echo CHtml::ajax(array(
            'url'=>array('adDroit/create'),
            'data'=> "js:$(this).serialize()",
            'type'=>'post',
            'dataType'=>'json',
            'success'=>"function(data)
            {
                if (data.status == 'failure')
                {
                    $('#dialogPermission div.divForForm').html(data.div);
                          // Here is the trick: on submit-> once again this function!
                    $('#dialogPermission div.divForForm form').submit(addPermission);
                }
                else
                {
                    $('#dialogPermission div.divForForm').html(data.div);
                   [color="#000080"] $.fn.yiiGridView.update('ad-droit-grid');[/color]
                    //setTimeout(\"$('#dialogPermission').dialog('close') \",3000);
                  
                }
 
            } ",
            ))?>;
    return false; 
 
}
 
</script>




<?php $this->widget('zii.widgets.grid.CGridView', array(
	'id'=>'ad-droit-grid',
	'dataProvider'=>$model->search(),
//	'filter'=>$model,
	'columns'=>array(
        array(
            'name'=>'droit_id',
            'class'=>'QGridColumn',
            'header'=>'nomnm',
        ),
        array(
            'name'=> 'nom',
            'class'=>'QGridColumn',
            'header'=>'nomnm',
        ),
        array(
            'name'=>'description',
            'class'=>'QGridColumn',
            'header'=>'des',
        ),
		array(
			'class'=>'QButtonColumn',

        ),
     ),
)); ?>


I have this error :

Quote

Uncaught TypeError: Cannot call method 'update' of undefined index.php:141
jQuery.ajax.success index.php:141
fire
self.fireWith
done
callback


In the function addPermission() I add :

$.fn.yiiGridView.update('ad-droit-grid');

any ideas ?

Nath
0

#2 User is offline   xahgmah 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 25
  • Joined: 08-October 12
  • Location:Ukraine, Kharkiv

Posted 24 October 2012 - 08:31 AM

If you use modal window (iframe), you must use this command
parent.$.fn.yiiGridView.update('ad-droit-grid');

And you must call this command after submiting form, not before
I usualy use Yii::app()->user->setFlash(...);

For example
In controller
if($model->save()){
Yii::app()->user->setFlash('success', 'Data saved successfully!');
$this->redirect('/path/to/this/form/');
}

In view with form
if (Yii::app()->user->hasFlash('success')){
       Yii::app()->clientScript->registerScript('success', "
               parent.$.fn.yiiGridView.update('category');
       ");
}

0

#3 User is offline   nath-0 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 81
  • Joined: 12-October 12
  • Location:switzerland

Posted 25 October 2012 - 02:27 AM

Thank you for your answer.

I tried your exemple but it doesn't work.

Don't you think that we can make the refresh here :

function addPermission()
{
    <?php echo CHtml::ajax(array(
            'url'=>array('adDroit/create'),
            'data'=> "js:$(this).serialize()",
            'type'=>'post',
            'dataType'=>'json',
            'success'=>"function(data)
            {
                if (data.status == 'failure')
                {
                    $('#dialogPermission div.divForForm').html(data.div);
                          // Here is the trick: on submit-> once again this function!
                    $('#dialogPermission div.divForForm form').submit(addPermission);
                }
                else
                {
                    $('#dialogPermission div.divForForm').html(data.div);
                   parent.$.fn.yiiGridView.update('ad-droit-grid');      <<<<<<<<<< ------- Update Grid !!!!!!!!!
                    //setTimeout(\"$('#dialogPermission').dialog('close') \",3000);
                  
                }
 
            } ",
            ))?>;
    return false; 
 
}


the timeOUt doesn't work, too !
0

#4 User is offline   nath-0 

  • Junior Member
  • Pip
  • Yii
  • Group: Members
  • Posts: 81
  • Joined: 12-October 12
  • Location:switzerland

Posted 25 October 2012 - 03:25 AM

I find the problem :

in the controller of create :

...


 if (Yii::app()->request->isAjaxRequest)
        {
            echo CJSON::encode(array(
                'status'=>'failure', 
                'div'=>$this->renderPartial('_form', array('model'=>$model), true))); <<<<<<<<<<< this is correct
               'div'=>$this->renderPartial('_form', array('model'=>$model), true,true))); <<<<<<<<<<< this is WRONG
            exit;               
        }
        else
            $this->render('create',array('model'=>$model,));
...

0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users