Yii Render a Model View Inside CJuiDialog

Question

I want to render a Model view completely in the CJuiDialog box.

what i did is i have a model JOB for this i have view files that are generated by Gii.

what i want- when clicking on id for each record on index.php i should open CJuiDialog box instead of rendering view file.

But, something going wrong-- when index page is accessed it displays all records for the job model and a pop up CJuiDialog box displaying first record( id=1 record)

and it displaying view for remaining records on the index page.

index.php

<?php
  $this->breadcrumbs=array(
 'Jobs',
);

$this->menu=array(
array('label'=>'Create Jobs','url'=>array('create')),
array('label'=>'Manage Jobs','url'=>array('admin')),
);
?>

<h1>Jobs</h1>

<?php $this->widget('bootstrap.widgets.TbListView',array(
'dataProvider'=>$dataProvider,
'itemView'=>'_view',
)); ?>

_view.php

<?php 
   $target = 'window.location='."'".$this->createUrl('jobs/index')."'";
 $this->beginWidget('zii.widgets.jui.CJuiDialog', array(
  'id'=>'mydialog',
 // additional javascript options for the dialog plugin
  'options'=>array(
    'title'=>'View Job..',
    'autoOpen'=>true,
  'buttons' => array(
array('text'=>'Route','click'=> 'js:function(){'.$target.'}'),
array('text'=>'Cancel','click'=> 'js:function(){$(this).dialog("close");}'),
),
  'height'=>400,
 'width'=>450,
 'show'=>'fade',
 'hide'=>'fade',
   ),
 ));

    //define the model
  // $model=new Jobs;
 echo 'dialog content here';
 $this->renderPartial('/jobs/view',array('model'=>$data));

 $this->endWidget('zii.widgets.jui.CJuiDialog');

// the link that may open the dialog
 echo CHtml::link('open dialog', '#', array(
'onclick'=>'$("#mydialog").dialog("open"); return false;',
 ));
 ?>

<div class="view">

<b><?php echo CHtml::encode($data->getAttributeLabel('job_id')); ?>:</b>
<?php echo CHtml::link(CHtml::encode($data->job_id),array('view','id'=>$data->job_id)); ?>
<br />
<b><?php echo CHtml::encode($data->getAttributeLabel('job_code')); ?>:</b>
<?php echo CHtml::encode($data->job_code); ?>
<br />

<b><?php echo CHtml::encode($data->getAttributeLabel('job_title')); ?>:</b>
<?php echo CHtml::encode($data->job_title); ?>
<br />

<b><?php echo CHtml::encode($data->getAttributeLabel('job_desc')); ?>:</b>
<?php echo CHtml::encode($data->job_desc); ?>
<br />

<b><?php echo CHtml::encode($data->getAttributeLabel('job_lastdate')); ?>:</b>
<?php echo CHtml::encode($data->job_lastdate); ?>
<br />

<b><?php echo CHtml::encode($data->getAttributeLabel('job_photo')); ?>:</b>
<?php echo CHtml::encode($data->job_photo); ?>
<br />

<b><?php echo CHtml::encode($data->getAttributeLabel('job_file')); ?>:</b>
<?php echo CHtml::encode($data->job_file); ?>
<br />

<?php /*
<b><?php echo CHtml::encode($data->getAttributeLabel('job_createtime')); ?>:</b>
<?php echo CHtml::encode($data->job_createtime); ?>
<br />

*/ ?>

</div>

view.php

 <h1>View Jobs #<?php echo $model->job_id; ?></h1>

 <?php $this->widget('bootstrap.widgets.TbDetailView',array(
'data'=>$model,
'attributes'=>array(
    'job_id',
    'job_code',
    'job_title',
    'job_desc',
    'job_lastdate',
    'job_photo',
    'job_file',
    'job_createtime',
),
)); ?>

controller actionView()

 public function actionView($id)
 {

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

I didn't getting whats wrong in my code. help me to solve this problem.. Thank You..

if i understand you correctly, you want to hit the index.php which will show all the records in a listview. When the id is clicked, you want to show the detail view in a popup? — Kirk, Jul 30 '14 at 17:18

Kirk · Accepted Answer · 2014-07-31T13:03:33.020

1

Assuming I understood your problem there are a couple problems with your widget declaration.

1.Your id is not unique for every ui widget on the screen. Change 'id' => 'mydialog' to something like "dialog_{$data->id}". Make sure to change the onclick jQuery id to match that id.

2.You have autoOpen set to true. Set it to false.

Also. You're echoing the 'dialog content here' in every dialog :) .

Cheers

edited Jul 31 '14 at 13:03

answered Jul 30 '14 at 17:43

Kirk

1,779
14
20

I tried as you suggested, but its not working. ' 'id'=>'dialog_{$data->id}', . . ... $this->renderPartial('/jobs/view',array('model'=>$data)); $this->endWidget('zii.widgets.jui.CJuiDialog'); // the link that may open the dialog echo CHtml::link('open dialog', '#', array( 'onclick'=>'$("#dialog_{$data->id}").dialog("open"); return false;', )); ?>' – FSShaikh Jul 31 '14 at 17:04
What's not working? Are you receiving an error? I have it working on my end with that. Compare your code to http://pastebin.com/3Y83BUPK Oh, and if that's the code you have in your app, you need to enclose 'dialog_{$data->id}' in double quotes; not single quotes. – Kirk Jul 31 '14 at 18:30
Solved,, Thank you so much. but i didn't get the exact meaning of the code `$dialogId = "dialog_{$data->job_id}";` and `'id'=>$dialogId,` , `array( 'onclick'=>'$("#'. $dialogId .'").dialog("open"); return false;',` But its working – FSShaikh Aug 01 '14 at 17:54
Setting `$dialogId = "dialog_{$data->job_id}";` means that the id for the html element will be something like `dialog_1`. The next record would be `dialog_2` assuming the jobs table has records with id=1 and the next with id=2. Now, when you use jQuery to select the dialog elements, you can do so as all the dialog elements have a **unique** id. Otherwise, multiple dialogs would be selected with one id. – Kirk Aug 01 '14 at 19:45
Hello.. there is another problem, in **actionIndex()** i have pagination `'pageSize'=>3,` so that when i go to next page it render all records view on to the index page and when clicking on the link **open dialog** nothing happens. whats going wrong?? in the **actionView** contains `if (Yii::app()->request->isAjaxRequest)` i think that is the problem, so how to prevent this to only take ajax request of only click on **open dialog** link and not from next pagination?? help please – FSShaikh Aug 04 '14 at 15:05

Yii Render a Model View Inside CJuiDialog

1 Answers1