Well, here’s the different versions I’ve tested:
[size="3"]The basic code[/size]
The form (e.g. ‘application.forms.challenge.userForm’):
<?php return array(
'title'=>yii::t('main','Please provide the challenge description'),
'attributes' =>array(
'enctype' => 'multipart/form-data',
),
'elements'=>array(
'title'=>array(
'type'=>'text',
'size'=>60,
),
'client'=>array(
'type'=>'text',
'size'=>60,
),
'content'=>array(
'type'=>'textarea',
),
'avatarFile'=>array(
'type'=>'file',
),
),
'buttons'=>array(
'submit'=>array(
'type'=>'submit',
'label'=>yii::t('core','Submit'),
),
CHtml::link(yii::t('core','Cancel'),yii::app()->homeUrl),
),
);
The controller action:
<?php class CreateAction extends CAction
{
public function run()
{
/**
* @var string the default layout for the view.
*/
$this->controller->layout='column1';
$model = new Challenge;
$form = new CForm('application.forms.challenge.userForm', $model);
// Uncomment the following line if AJAX validation is needed
// $this->controller->performAjaxValidation($model);
if(isset($_POST['Challenge']))
{
$model->setScenario('create');
$model->attributes=$_POST['Challenge'];
// Set status
$model->status=Challenge::STATUS_PROPOSED;
// Set user
$model->user_id = Yii::app()->user->id;
if($model->save())
{
$this->controller->redirect(Yii::app()->homeUrl);
}
}
else
{
$this->controller->render('create',array('form'=>$form));
}
}
}
ChallengeController’s performAjaxValidation function (used by the action):
public function performAjaxValidation($model)
{
if(isset($_POST['ajax']) && $_POST['ajax']==='challenge-form')
{
echo CActiveForm::validate($model);
Yii::app()->end();
}
}
[size="3"]Attempt 1: regular CForm - this works[/size]
The form: the basic form as given at the beginning of this post.
The controller action: the basic action as given at the beginning of this post.
[size="3"]Attempt 2: CForm with CKEditor - this works[/size]
The form: as given at the beginning of this post, but with the CKEditor widget as the ‘content’ field element:
'content'=>array(
'type'=>'application.extensions.NHCKEditor.CKEditorWidget',
'editorOptions' => array(
'removePlugins' => 'elementspath,save,font',
'toolbarCanCollapse'=>'false',
'bodyClass'=>'formWidget',
'resize_maxWidth'=>'600px',
'toolbar' => array(
array('Bold','Italic','Underline','Strike','-','NumberedList','BulletedList','-','Outdent','Indent','Blockquote','-','Link','Unlink','-','Table','SpecialChar','-','Cut','Copy','Paste','-','Undo','Redo','-','Maximize',),
),
'format_p' => array(
'element' => 'p',
'attributes' > null,
),
'ignoreEmptyParagraph' => true,
'font_style' => array(
'element' => null,
),
),
'htmlOptions' => array('class'=>'formWidget'),
),
The controller action: same as given at the beginning of this post.
[size="3"]Attempt 3: regular CActiveForm - this works[/size]
The form: as given at the beginning of this post, but with addition of the ‘activeForm’ definition:
'activeForm' => array(
'class' => 'CActiveForm',
'enableAjaxValidation' => true,
'id' => 'challenge-form',
'clientOptions'=>array(
'validateOnSubmit'=>true,
'validateOnChange'=>false,
'validateOnType'=>false,
),
),
The controller action: as given at the beginning of this post, but with this line enabled:
// Uncomment the following line if AJAX validation is needed
$this->controller->performAjaxValidation($model);
[size="3"]Attempt 4: CActiveForm with CKEditor - this does not work![/size]
The form: as given at the beginning of this post, but with addition of the ‘activeForm’ definition and with the CKEditor widget as the ‘content’ field element. This results in the following form:
<?php return array(
'title'=>yii::t('main','Please provide the challenge description'),
'attributes' =>array(
'enctype' => 'multipart/form-data',
),
'activeForm' => array(
'class' => 'CActiveForm',
'enableAjaxValidation' => true,
'id' => 'challenge-form',
'clientOptions'=>array(
'validateOnSubmit'=>true,
'validateOnChange'=>false,
'validateOnType'=>false,
),
),
'elements'=>array(
'title'=>array(
'type'=>'text',
'size'=>60,
),
'client'=>array(
'type'=>'text',
'size'=>60,
),
'content'=>array(
'type'=>'application.extensions.NHCKEditor.CKEditorWidget',
'editorOptions' => array(
'removePlugins' => 'elementspath,save,font',
'toolbarCanCollapse'=>'false',
'bodyClass'=>'formWidget',
'resize_maxWidth'=>'600px',
'toolbar' => array(
array('Bold','Italic','Underline','Strike','-','NumberedList','BulletedList','-','Outdent','Indent','Blockquote','-','Link','Unlink','-','Table','SpecialChar','-','Cut','Copy','Paste','-','Undo','Redo','-','Maximize',),
),
'format_p' => array(
'element' => 'p',
'attributes' > null,
),
'ignoreEmptyParagraph' => true,
'font_style' => array(
'element' => null,
),
),
'htmlOptions' => array('class'=>'formWidget'),
),
'avatarFile'=>array(
'type'=>'file',
),
),
'buttons'=>array(
'submit'=>array(
'type'=>'submit',
'label'=>yii::t('core','Submit'),
),
CHtml::link(yii::t('core','Cancel'),yii::app()->homeUrl),
),
);
The controller action: as given at the beginning of this post, but with this line enabled:
// Uncomment the following line if AJAX validation is needed
$this->controller->performAjaxValidation($model);
It seems that even when I enter some text in the CKEditor decorated ‘content’ textarea field it is empty on the first submit, thus creating a validation error. If I then submit the form again it is accepted, e.g. the text now is part of the posted content.
Seems logical to me that this is a conflict between JS scripts. Both the client-side validation by CActiveForm and CKEditor are JS-based. I’m not skilled at javascript though, so I’m kind of stuck here…
Any suggestions?