Contact form and ajax validation

Well, i would like perform Ajax validation on the contact form

So :

my siteController :


<?php


class SiteController extends Controller

{

	/**

	 * Declares class-based actions.

	 */





	public function actions()

	{

		return array(

			// captcha action renders the CAPTCHA image displayed on the contact page

			'captcha'=>array(

				'class'=>'CCaptchaAction',

				'backColor'=>0xFFFFFF,

                                'transparent'=>true,

                                'testLimit'=>1,

                                'foreColor'=>0xEF4135


			),

			// page action renders "static" pages stored under 'protected/views/site/pages'

			// They can be accessed via: index.php?r=site/page&view=FileName

			'page'=>array(

				'class'=>'CViewAction',

			),

		);

	}


	/**

	 * This is the default 'index' action that is invoked

	 * when an action is not explicitly requested by users.

	 */

	public function actionIndex()

	{

		// renders the view file 'protected/views/site/index.php'

		// using the default layout 'protected/views/layouts/main.php'

		$this->render('index');

	}


	/**

	 * This is the action to handle external exceptions.

	 */

	public function actionError()

	{

	    if($error=Yii::app()->errorHandler->error)

	    {

	    	if(Yii::app()->request->isAjaxRequest)

	    		echo $error['message'];

	    	else

	        	$this->render('error', $error);

	    }

	}


	/**

	 * Displays the contact page

	 */

	public function actionContact()

	{

		$model=new ContactForm;

                if(isset($_POST['ajax']) && $_POST['ajax']==='contact-form')

                {

                        echo CActiveForm::validate($model);

                        Yii::app()->end();

                }

		if(isset($_POST['ContactForm']))

		{

			$model->attributes=$_POST['ContactForm'];

			if($model->validate())

			{

				$headers="From: {$model->email}\r\nReply-To: {$model->email}";

				mail(Yii::app()->params['adminEmail'],$model->subject,$model->body,$headers);

				Yii::app()->user->setFlash('contact','Thank you for contacting us. We will respond to you as soon as possible.');

				$this->refresh();

			}

		}

		$this->render('contact',array('model'=>$model));

	}


	/**

	 * Displays the login page

	 */

	public function actionLogin()

	{

		$model=new LoginForm;


		// Uncomment the following line if AJAX validation is needed

                $this->performAjaxValidation($model);




		// collect user input data

		if(isset($_POST['LoginForm']))

		{

			$model->attributes=$_POST['LoginForm'];

			// validate user input and redirect to the previous page if valid

			if($model->validate() && $model->login())

				$this->redirect(Yii::app()->user->returnUrl);

		}

		// display the login form

		$this->render('login',array('model'=>$model));

	}


	/**

	 * Logs out the current user and redirect to homepage.

	 */

	public function actionLogout()

	{

		Yii::app()->user->logout();

		$this->redirect(Yii::app()->homeUrl);

	}


        protected function performAjaxValidation($model)

        {

                if(isset($_POST['ajax']) && $_POST['ajax']==='contact-form')

                {

                        echo CActiveForm::validate($model);

                        Yii::app()->end();

                }

        }


        




}

and my view :


<?php

$this->pageTitle=Yii::app()->name . ' - Contact Us';

$this->breadcrumbs=array(

	'Contact',

);

?>




<div id="uniqueColumn">

<h2>Contact Us</h2>


<?php if(Yii::app()->user->hasFlash('contact')): ?>


<div class="flash-success">

	<?php echo Yii::app()->user->getFlash('contact'); ?>

</div>


<?php else: ?>

<br>

<h3>

If you have business inquiries or other questions, please fill out the following form to contact us. Thank you.

</h3>


<div class="form">




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

        'id'=>'contact-form',

        'enableAjaxValidation'=>true,

)); ?>




	<p class="note">Fields with <span class="required">*</span> are required.</p>


	<?php echo $form->errorSummary($model); ?>


	<p class="note">

		<?php echo $form->labelEx($model,'name'); ?>

		<?php echo $form->textField($model,'name'); ?>

	</p>


	<p class="note">

		<?php echo $form->labelEx($model,'email'); ?>

		<?php echo $form->textField($model,'email'); ?>

	</p>


	<p class="note">

		<?php echo $form->labelEx($model,'subject'); ?>

		<?php echo $form->textField($model,'subject',array('size'=>60,'maxlength'=>128)); ?>

	</p>


	<p class="note">

		<?php echo $form->labelEx($model,'body'); ?>

		<?php echo $form->textArea($model,'body',array('rows'=>6, 'cols'=>50)); ?>

	</p>


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

	<p class="note">


		<?php echo $form->labelEx($model,'verifyCode'); ?>

		<div>

		<?php $this->widget('CCaptcha'); ?>

		<?php echo $form->textField($model,'verifyCode'); ?>

		</div>

		<div class="hint">Please enter the letters as they are shown in the image above.

		<br/>Letters are not case-sensitive.</div>

        </p>


	<?php endif; ?>

	

		<?php echo CHtml::submitButton('Submit'); ?>

	

        <br/>

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

</div>


</div><!-- form -->


<?php endif; ?>

And it don’t work. Ajax seems to be not activated, and i have nothing in XHR of firebug. :(

Thanks a lot

Ajax validation works only for those attributes for which there is a corresponding call of the $form->error() method:




        <div class="note">

                <?php echo $form->labelEx($model,'subject'); ?>

                <?php echo $form->textField($model,'subject',array('size'=>60,'maxlength'=>128)); ?>

                <?php echo $form->error($model,'subject'); ?>

        </div>



Also note, I replaced <p> with <div>, because I’m not sure it works with <p> container tag.

Now I have this, and Ajax don’t perform validation too :(


<?php

$this->pageTitle=Yii::app()->name . ' - Contact Us';

$this->breadcrumbs=array(

	'Contact',

);

?>




<div id="uniqueColumn">

<h2>Contact Us</h2>


<?php if(Yii::app()->user->hasFlash('contact')): ?>


<div class="flash-success">

	<?php echo Yii::app()->user->getFlash('contact'); ?>

</div>


<?php else: ?>

<br>

<h3>

If you have business inquiries or other questions, please fill out the following form to contact us. Thank you.

</h3>


<div class="form">




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

        'id'=>'contact-form',

        'enableAjaxValidation'=>true,

)); ?>




	<p class="note">Fields with <span class="required">*</span> are required.</p>


	<?php echo $form->errorSummary($model); ?>


	<div class="note">

		<?php echo $form->labelEx($model,'name'); ?>

		<?php echo $form->textField($model,'name'); ?>

                <?php echo $form->error($model,'name'); ?>


	</div>


	<div class="note">

		<?php echo $form->labelEx($model,'email'); ?>

		<?php echo $form->textField($model,'email'); ?>

                <?php echo $form->error($model,'email'); ?>

	</div>


	<div class="note">

		<?php echo $form->labelEx($model,'subject'); ?>

		<?php echo $form->textField($model,'subject',array('size'=>60,'maxlength'=>128)); ?>

                <?php echo $form->error($model,'subject'); ?>

	</div>


	<div class="note">

		<?php echo $form->labelEx($model,'body'); ?>

		<?php echo $form->textArea($model,'body',array('rows'=>6, 'cols'=>50)); ?>

                <?php echo $form->error($model,'body'); ?>

	</div>


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

	<div class="note">


		<?php echo $form->labelEx($model,'verifyCode'); ?>

		<div>

		<?php $this->widget('CCaptcha'); ?>

		<?php echo $form->textField($model,'verifyCode'); ?>

                <?php echo $form->error($model,'verifyCode'); ?>

		</div>

		<div class="hint">Please enter the letters as they are shown in the image above.

		<br/>Letters are not case-sensitive.</div>

        </div>


	<?php endif; ?>

	

		<?php echo CHtml::submitButton('Submit'); ?>

	

        <br/>

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

</div>


</div><!-- form -->


<?php endif; ?>

I found !

I must add “‘clientOptions’=>array(‘validateOnSubmit’=>true, ‘validateOnChange’=>false),” in my view !


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

        'id'=>'contact-form',

        'enableAjaxValidation'=>true,

        'clientOptions'=>array('validateOnSubmit'=>true, 'validateOnChange'=>false),


)); ?>