Errors on submit in a popup box?

Question

How to show the validation errors in a form in a pop dialogue box?Instead of showing it in the top of the form as a separate div, i want to show those errors in a popup dialogue box so that user clicks okay and dismiss the box.How to do this in yii?

Answer 1

If you enable client side validation, then you will get error message under textbox, dropdown. There is no in-built option for poping up error message.

still if you need popup error message display, then you have to do with jquery. Then add in Yii forum to help others as well :-)

Refer this link (Yii forum) for details about client side validation

Answer 2

You can build the HTML view yourself with a custom CFormModel and use getError() method in a modal popup.

See : http://www.yiiframework.com/doc/api/1.1/CModel#getError-detail

and : http://www.yiiframework.com/doc/api/1.1/CFormModel

Answer 3

Register your own javascript function name to the afterValidate, which is one of the options in clientOptions property in CActiveForm form class.

Your form declaration should have

     'clientOptions' => array(
            'validateOnSubmit' => true,
            'afterValidate' => 'js:myFunc',
     ),

And Your form will appear like bellow

                <?php
                $form = $this->beginWidget('CActiveForm', array(
                    'id' => 'a-form',
                    'enableClientValidation' => true,
                    'enableAjaxValidation' => true,
                    'errorMessageCssClass' => 'required',
                    'clientOptions' => array(
                        'validateOnSubmit' => true,
                        'afterValidate' => 'js:myFunc',
                    ),
                ));
                ?>

                ------Your form fields------------

                ------Your form fields------------

                ------Your form fields------------


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

Now, Your myFunc code:

        <script type="text/javascript" charset="utf-8">
            function myFunc(form, data, hasError)
            {

                if (hasError) 
                {
                    var errors='';
                    $.each(data, function(obj)
                    {
                        errors+=data[obj][0]+"\n";
                    });
                    alert(errors);

                    // Do what ever you want

                    return true;
                }
            }
        </script>