You are viewing revision #3 of this wiki article.
This version may not be up to date with the latest version.
You may want to view the differences to the latest version.
I am a newbie, i thought my code may help some one. Try this and let me know if here is any error or any other better way to do this.
Scenario: ¶
Let we have enum for table field menuType as shown below.
menuType : enum('Page','PhpPage','External')
pageId: int (If menuType is 'Page')
phpPageId: int (If menuType is 'PhpPage')
externalLink: varchar (If menuType is 'External')
Form elements: ¶
Now in form, based on menu type selection i want to show or hide other 3 fields. The below code will take care of it. I have called 'menuTypeChange' function on change of any radio selection. This function will show/hide respected elements.
<script language="javascript">
function menuTypeChange(menyType)
{
$('.menuType').hide();
if(menyType!="")
$('#'+menyType+'Div').show();
}
</script>
<div class="row">
<?php echo $form->labelEx($model,'menuType'); ?>
<?php echo $form->radioButtonList($model,'menuType',array('Page'=>'Page','PhpPage'=>'PHP Page', 'External'=>'External'), array('onchange' => 'menuTypeChange(this.value);')); ?>
<?php echo $form->error($model,'menuType'); ?>
</div>
<div id="PageDiv" class="row menuType">
<?php echo $form->labelEx($model,'pageId'); ?>
<?php echo $form->dropDownList($model, 'pageId', CHtml::listData(Page::model()->findAll(array('condition'=>'isDeleted=:isDeleted', 'params'=>array(':isDeleted'=>0))), 'pageId', 'pageName'), array('empty'=>'- - Select - -')); ?>
<?php echo $form->error($model,'pageId'); ?>
</div>
<div id="PhpPageDiv" class="row menuType">
<?php echo $form->labelEx($model,'phpPageId'); ?>
<?php echo $form->dropDownList($model, 'phpPageId', CHtml::listData(PhpPage::model()->findAll(), 'phpPageId', 'phpPageName'), array('empty'=>'- - Select - -')); ?>
<?php echo $form->error($model,'phpPageId'); ?>
</div>
<div id="ExternalDiv" class="row menuType">
<?php echo $form->labelEx($model,'externalLink'); ?>
<?php echo $form->textField($model,'externalLink',array('size'=>60,'maxlength'=>255)); ?>
<?php echo $form->error($model,'externalLink'); ?>
</div>
<script language="javascript">
menuTypeChange('<?php echo $model->menuType;?>');
</script>
I have done with form. Now the problem is validation.
How validation works? ¶
With default rules when i submit form it is asking me all 3 fields validation even i have selected only one menu type. For this let me create one new custom validation function as shown below.
public function rules()
return array(
....
....
array('menuType', 'required'),
array('pageId','radioValidate','menuType','Page'),
array('phpPageId','radioValidate','menuType','PhpPage'),
array('externalLink','radioValidate','menuType','External'),
array('externalLink', 'url'),
....
);
}
public function radioValidate($attribute,$params)
{
$field = $params[0];
$value = $params[1];
if($this->$field == $value && $this->$attribute == '')
{
$this->addError($attribute,$this->getAttributeLabel($attribute).' cannot be blank.');
}
}
Let me explain more on this rule:
array('pageId','radioValidate','menuType','Page'),
Above rule means: If menuType's value is Page then only pageId is compulsory.
Same goes with other too,
array('phpPageId','radioValidate','menuType','PhpPage'),
array('externalLink','radioValidate','menuType','External'),
Validation
Hi,
Great wiki , but validation is not working for me, same i copy paste it
Advise plz
Client side validation
client side validation is not working..
validation
To solve the validation problem I did the following:
defined a jquery function:
$.fn.menuTypeChange = function() {
};
and called this way:
array('onchange' => '$(this).menuTypeChange();')
instead of:
array('onchange' => 'menuTypeChange(this.value);')
If you have any questions, please ask in the forum instead.
Signup or Login in order to comment.