How To Change Forms Dynamically Based On Radiobutton Selection In Yii

I’m new to Yii framework. I have a requirement where I have two radio buttons

  1. Single Language

  2. Multi Language

I want the same form to be displayed differently for single language and multilanguage.

I created two divs and wrote fields that change dynamically based on radio button selection :




    <div id="single_language" style="display:none;">

    					<h2><a href="" id="addScnt">Add Another Input Box</a></h2>

    					<div class="row" id="welcome_notes">

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

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

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

    					</div>

    

    					<div class="row">

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

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

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

    					</div>

    

    					<div class="row">

    						<?php

    //$action = $_POST['action'];

    //echo $action;?>

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

    						<?php echo $form->dropDownList($model,'selectionList',array(''=>''),array('class'=>'multiselect')); ?>

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

    					</div>

    

    					

    

    					<div class="row">

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

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

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

    					</div>

    				</div>

    				<div id="multi_language" style="display:none;">

    					<div class="row">

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

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

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

    					</div>

    

    					<div class="row">

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

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

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

    					</div>

    

    					<div class="row">

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

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

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

    					</div>

    

    					<div class="row">

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

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

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

    					</div>

    				</div>



I have written a small script to change form based on radio button selection:




    $('#id_radio1').click(function () {

    		$('#multi_language').hide('fast');

    		$('#single_language').show('fast');

    	});

    	$('#id_radio2').click(function () {

    		$('#single_language').hide('fast');

    		$('#multi_language').show('fast');

    	});    

    	});  



The dynamic form works as I want it to work, but when I enter any data in single language and store it, it is stored as empty as it is overidden by the values in multilanguage div.

How can I over come this error? What is the most optimum way of handling such situations.

I think that main problem here is that U are using same form for both selections.

Try placing 2 forms instead of one:

$form1 = $this->beginWidget(‘CActiveForm’, array(…));

$form2 = $this->beginWidget(‘CActiveForm’, array(…));

than U can user $form1 for #single_language and $form2 for multi_language. Be sure that U are submiting each form separate.

1 Like