[SOLVED] How to enable form validation in jui Dialog


My app present a dashboard with several AR (User -> phones & address).

I’m able to edit an AR in a modal CJuiDialog. When save is valid I redirect the user to the dashboard.

The dashboard view contain a empty CJuiDialog widget. Its internal div that is populated by a sync ajax call followed by a dialog("open");

Unfortunately (of course) the validation didn’t work… I’m redirected to my _form, renderpartial

Can someone give a idea on how to achieve validation or point me to an exemple ?


Ok I found a solution.

My dashboard controller always displays the lists. The main view displays several datagrids.

At this point, I have an userController->actionDashboard that renders viewDashboard.php

When user need to edit a particular AR, he call userController->actionUpdatePhone that perform standard update/create stuff on model (load phoneModel, do validation…) and pass it to viewDashboard.php as a parameter.

In this case viewDashBord.php add a zii.widgets.jui.CJuiDialog widget at the bottom of viewDashboard.pghp and render the _form inside. This _form is simply the one who was generated by yiic (with some custo).

The dialog is modal, so in background you see all datagrids. The actual page ‘UpdatePhone’ contains a form that could be submitted, ss validated, even ajax ss validated…

When everything is ok, I go back ($this->redirect(…) ) to the dashbord with updated data.

CJuiDialog’s options, (look at events & buttons)





         // additional javascript options for the dialog plugin

         'options' => array(

            'title' => $dialogTitle,

            'autoOpen' => true,

            'modal' => true,

            'height' => 'auto',

            'width' => '600px',

            'open' => 'js: function(event, ui){ $("#dialogContent").removeClass("hideMe"); }',

            'beforeclose' => 'js: function(event, ui){ $("#dialogContent").html(""); }',

            'close'=> 'js: function(event, ui){ window.location = "'.Yii::app()->createUrl('dashboard').'";}',


            'Save'=>'js: function() {$("#saveButton").click();}',

            'Cancel'=>'js: function() {$(this).dialog(\'close\');}',







<div id="dialogContent" class="hideMe">

   <?php $this->renderPartial( $viewForDialog , $paramsForForm ); ?>





Of course you need to override cGRid action columns, customize _form…

Hope this help (if someone understands my english…)

You english does not help. If you have time please rewrite it.