Displaying wrong CJuiDialog

bbeira · July 16, 2015, 4:04am

My main (default) view is called ‘home’. On this view I have four models: ‘Login’, ‘Contact Us’, ‘Reset Password - Email’, and ‘Reset Password - Question’. The Reset Password models are displayed in CJuiDialogs.

The Login form has a ‘Reset Password’ link. Clicking this link displays the ‘Reset Password - Email’ model where user is required to enter their email address. If the user enters an incorrect email address then this model is displayed again.

If the user enters a correct email address then the ‘Reset Password - Question’ model is displayed where the user is prompted to enter the Answer to their Security Question.

My problem is described as a process flow below:

user clicks ‘Reset Password’ link on Login Form
Reset Password - Email model displayed
user submits correct email address
Reset Password - Question model displayed
user clicks ‘Cancel’ or presses the ‘ESC’
Reset Password - Question disappears
user clicks ‘Reset Password’ link on Login Form
Reset Password - Question model displayed

I would like to, if the above flow is performed, to display the Password - Email model at step 8. Below is the code for my view.


<?php$this->pageTitle=Yii::app()->name;

     $image_url = Yii::app()->baseUrl.'/images/';

?>


<head><style>

    #page_details{height:800px; background:url(<?php echo $image_url.'home_bkgd.jpg'?>);}

</style></head>


<!-- LOGIN FORM MODEL -->

<p style="color:White; font-size:12pt; font-weight:bold; margin-left:493px; margin-top:63px;">Existing Punters</p>


<div class="form">

    <?php $form=$this->beginWidget('CActiveForm', array('id'=>'login-form',

          'enableClientValidation'=>true,

         'focus'=>array($model_l, 'email'),

         'clientOptions'=>array('validateOnSubmit'=>true,),)); ?>


         <p style="margin-left:362px; margin-top:102px;">Punter:</p>

         <div style="margin-left:440px; margin-top:99px; position:absolute;"><?php echo $form->textField($model_l,'email');?></div>

          <div id="error_text" style="margin-left:428px; margin-top:125px;"><?php echo $form->error($model_l,'email');?></div>

          <p style="margin-left:362px; margin-top:147px;">Password:</p>

          <div style="margin-left:440px; margin-top:144px; position:absolute;"><?php echo $form->passwordField($model_l,'password');?></div>

          <div id="error_text" style="margin-left:428px; margin-top:171px;"><?php echo $form->error($model_l,'password');?></div>


           <a style="margin-left:640px; margin-top:109px;"><?php echo CHtml::imageButton($image_url.'b_login_login.png'); ?></a>

         

<!-- THIS IS WHERE THE RESET PASSWORD DIALOGS ARE DISPLAYED -->

           <div style="width:200px; margin-left:616px; margin-top:142px; position:absolute;"><?php echo CHtml::link('Reset My Password', "", array('style'=>'font-size:10pt; color:Blue; cursor:pointer; text-decoration:underline;', 'onclick'=>'show_reset(); false;'));?></div>


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

</div>


<!-- CONTACT US FORM -->

<div class="form">

    <?php $form=$this->beginWidget('CActiveForm', array('id'=>'contactus-form',

       'enableClientValidation'=>true,

       'clientOptions'=>array('validateOnSubmit'=>true),)); ?>


    <p style="font-size:9pt; margin-left:640px; margin-top:425px;">Name:</p>

    <div style="margin-left:690px; margin-top:422px; position:absolute;"><?php echo $form->textField($model_c,'name');?></div>

    <div id="error_text" style="font-size:9pt; margin-left:690px; margin-top:443px; position:absolute;"><?php echo $form->error($model_c,'name');?></div> <p style="font-size:9pt; margin-left:850px; margin-top:425px;">Email:</p>

    <div style="margin-left:895px; margin-top:422px; position:absolute;"><?php echo $form->textField($model_c,'email');?></div>

    <div id="error_text" style="font-size:9pt; margin-left:895px; margin-top:443px; position:absolute;"><?php echo $form->error($model_c,'email');?></div>

    <p style="font-size:9pt; margin-left:640px; margin-top:465px;">Subject:</p>

    <div style="margin-left:690px; margin-top:462px; position:absolute;"><?php echo $form->textField($model_c,'subject');?></div>

    <div id="error_text" style="font-size:9pt; margin-left:690px; margin-top:483px; position:absolute;"><?php echo $form->error($model_c,'subject');?></div>

    <p style="font-size:9pt; margin-left:640px; margin-top:495px;">Description:</p>

    <p style="font-size:9pt; margin-left:715px; margin-top:495px;">(Maximum of 1000 characters)</p>

    <div style="margin-left:640px; margin-top:510px; position:absolute;"><?php echo $form->textArea($model_c,'body', array('onKeyUp'=>'checkBodyChars()')); ?></div>

    <div id="error_text" style="font-size:9pt; margin-left:640px; margin-top:624px; position:absolute;"><?php echo $form->error($model_c,'body');?></div> <p style="font-size:9pt; color:black; font-weight:bold; width:400px; margin-left:640px; margin-top:639px; position:absolute;">Please enter the letters as they are shown in the image below. Letters are not case-sensitive. Click on the image to generate a new code.</p>

    <p style="font-size:9pt; margin-left:640px; margin-top:681px;">Verification code:</p>

    <div style="margin-left:740px; margin-top:677px; position:absolute;"><?php echo $form->textField($model_c,'verifyCode'); ?></div>


    <?php if(CCaptcha::checkRequirements()):

         $session = Yii::app()->session;

         $prefixLen = strlen(CCaptchaAction::SESSION_VAR_PREFIX);

         

         foreach ($session->keys as $key)

         {

             if (strncmp(CCaptchaAction::SESSION_VAR_PREFIX, $key, $prefixLen) == 0)

                 $session->remove($key); 

         } ?>


         <div style="font-size:10pt; margin-left:820px; margin-top:670px; position:absolute;"><?php $this->widget('CCaptcha', array('imageOptions'=>array('style'=>'height:35px; length:100px;',))); ?></div>

    <?php endif; ?>


    <div id="error_text" style="margin-left:640px; margin-top:698px; position:absolute;"><?php echo $form->error($model_c,'verifyCode');?></div>

    <a style="margin-left:940px; margin-top:690px;"><?php echo CHtml::imageButton($image_url.'b_contactus_send.png');?></a>

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

</div>


<!-- RESET PASSWORD - ENTER QUESTION - DISPLAYED IF A CORRECT EMAIL ADDRESS IS PROVIDED -->

<?php if ($model_rq->question) { ?>

    <?php $this->beginWidget('zii.widgets.jui.CJuiDialog', array('id'=>'reset_dialog','htmlOptions'=>array('style'=>'background-image:url('.$image_url.'resetpwd_answer_dialog_bkgd.jpg);'), 'options'=>array('autoOpen' => true,

        'modal' => true,

        'title'=>'Reset',

        'width'=> '500px',

        'resizable'=> false,))); ?>


    <div class="form" style="height:230px;">

        <p style="color:white; font-size:12pt; font-weight:bold; margin-left:45px; margin-top:18px;">Please enter the answer to your security question</p>

       

       <?php $form=$this->beginWidget('CActiveForm', array('id'=>'resetquestion-form',   'enableClientValidation'=>true,

   'focus'=>array($model_rq, 'answer'),

   'clientOptions'=>array('validateOnSubmit'=>true,),)); ?>


         <p style="margin-left:50px; margin-top:110px;">Question:</p>

         <p style="font-style:italic; margin-left:120px; margin-top:110px;"><?php echo $model_rq->question; ?>

         <div style="margin-left:120px; margin-top:60px; position:absolute;"><?php echo $form->textField($model_rq,'email'); ?></div>

         <p style="margin-left:50px; margin-top:140px;">Answer:</p>

         <div style="margin-left:120px; margin-top:137px; position:absolute;"><?php echo $form->textField($model_rq,'answer');?></div>

         <div id="error_text" style="margin-left:120px; margin-top:165px; position:absolute;"><?php echo $form->error($model_rq,'answer');?></div>

          <a style="margin-left:300px; margin-top:165px;"><?php echo CHtml::imageButton($image_url.'b_resetpwd_reset.png'); ?></a>

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

     </div>

<?php $this->endWidget();


// RESET PASSWORD - ENTER EMAIL - DISPLAYED IF AN INCORRECT  EMAIL ADDRESS IS PROVIDED -->

} else if ($model_re->email) { 

     $this->beginWidget('zii.widgets.jui.CJuiDialog', array('id'=>'reset_dialog','htmlOptions'=>array('style'=>'background-image:url('.$image_url.'resetpwd_question_dialog_bkgd.jpg);'), 'options'=>array('autoOpen' => true,

                'modal' => true,

                'title'=>'Reset',

                'width'=> '500px',

                'resizable'=> false,))); ?>

    <div class="form">

         <p style="color:white; font-size:12pt; font-weight:bold; margin-left:110px; margin-top:18px;">Please enter your email address</p>

         <?php $form=$this->beginWidget('CActiveForm', array('id'=>'resetemail-form',

              'enableClientValidation'=>true,

             'focus'=>array($model_re, 'email'),

              'clientOptions'=>array('validateOnSubmit'=>true,),)); ?>

         <p style="margin-left:50px; margin-top:63px;">Punter:</p>

         <div style="margin-left:120px; margin-top:60px; position:absolute;"><?php echo $form->textField($model_re,'email'); ?></div>

         <div id="error_text" style="margin-left:112px; margin-top:86px; position:absolute;"><?php echo $form->error($model_re,'email'); ?></div> <a style="margin-left:300px; margin-top:57px;"><?php echo CHtml::imageButton($image_url.'b_resetpwd_submit.png'); ?></a>

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

    </div>

<?php $this->endWidget(); 

} else {


// RESET PASSWORD - EMAIL - DISPLAYED IF 'Reset Password' link is clicked -->

    $this->beginWidget('zii.widgets.jui.CJuiDialog', array('id'=>'reset_dialog','htmlOptions'=>array('style'=>'background-image:url('.$image_url.'resetpwd_question_dialog_bkgd.jpg);'), 'options'=>array('autoOpen' => false,

                'modal' => true,

                'title'=>'Reset',

                'width'=> '500px',

                'resizable'=> false))); ?>

    <div class="form">

         <p style="color:white; font-size:12pt; font-weight:bold; margin-left:110px; margin-top:18px;">Please enter your email address</p> <?php $form=$this->beginWidget('CActiveForm', array('id'=>'resetemail-form',

              'enableClientValidation'=>true,

               'focus'=>array($model_re, 'email'),

               'clientOptions'=>array('validateOnSubmit'=>true,),)); ?>

         <p style="margin-left:50px; margin-top:63px;">Punter:</p>

         <div style="margin-left:120px; margin-top:60px; position:absolute;"><?php echo $form->textField($model_re,'email'); ?></div>

         <div id="error_text" style="margin-left:112px; margin-top:86px; position:absolute;"><?php echo $form->error($model_re,'email'); ?></div>

         <a style="margin-left:300px; margin-top:57px;"><?php echo CHtml::imageButton($image_url.'b_resetpwd_submit.png'); ?></a>

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

    </div>

<?php $this->endWidget(); 

} ?>


<script type="text/javascript">

    function show_reset()

    {

         $("#reset_dialog").dialog("open");


    }

</script>

bbeira · July 20, 2015, 4:08am

The view has to be refreshed.

softark · July 20, 2015, 10:57pm

Note that the statement "<?php if ($model_rq->question) { ?>" (and the likes) only works on the server side.

If you want to show every dialog without refreshing the browser view, you have to write some extra code to handle the user status (or workflow) on the client side.