Hello,
Yii 2.0.1, I have a registration form and I want to add dynamic fieldset that should be saved in separate table.
So user loads the form, he sees 1 fieldset and [Add more] button, when the button is clicked, another fieldset should be added below with Javascript, fields validated and when the form is submitted it should insert the fields in main table and in additional table for the fieldset.
How can I implement it?
Create a function in your controller that would add a fieldset. Make ajax call from the [Add more] button to that function and append the data to the form.
In the actionSave you will have to save the models separately. The main one and the other ones. I don’t know about the validation of dynamically added fields.
Let me know if you need sample code or something is unclear. Or post some parts of your code.
Hello,
Sounds like a good plan.
I’m so new to Yii2 that I’m still trying to figure out how to do it.
I’ve already generated the _form view for the fieldset, so trying to figure out how to add it to the form on load and on [Add more] button click.
Could you please guide me which functions should be used to append data to form on button click?
I think I will not have problems saving things to database.
Thanks!
I’ll illustrate with an example.
Model name is Example, function name in controller will be actionTest
in your _form.php have a button, counter, to know how many fields you have added, and a div in which the data will be placed.
<?php
echo Html::input('button','btn_add','Add More',[
'onclick'=>'$.post( "' . Yii::$app->urlManager->createUrl(['example/test', 'i'=>'']).'"+$("#counter").val(),
function( data ){
var val = $("#counter").val();
$( "#counter" ).val( parseInt(val) + 1 );
$( "div#newlyaddedfields" ).append( data );
});
',//onclick end
]);
?>
<?php echo Html::hiddenInput('counter',0,['id'=>'palcnt',]); ?>
<div id="newlyaddedfields"></div>
in your ExampleController.php
public function actionTest($i)
{
$mod = new Example();
echo Html::activeTextInput($mod,"[$i]testattribute");
}
If you want to add the fields on load it’s probably fine to just add them straight up in the _form.
Oh my god, this is genious!! Thank you, Will paste my final code of the form tomorrow!!
It doesn’t want to validate the fields in this way. I think will have to write additional validation rules for dynamic things.
How can I implement [Remove fieldset] ?
Yeah, I’m kind of stuck at validating dynamically added fields too…
The remove would probably have to be done with some jquery magic too.
I’ve moved fields out of controller…
now I’m doing
View:
<?php
echo Html::input(‘button’,‘btn_add’,‘Add More’,[
'onclick'=>'$.post( "' . Yii::$app->urlManager->createUrl(['employeequalifications/create', 'i'=>'']).'"+$("#counter").val(),
function( data ){
var val = $("#counter").val();
$( "#counter" ).val( parseInt(val) + 1 );
$( "div#newlyaddedfields" ).append( data );
$( "div#newlyaddedfields" ).wrap( "<div class=\'new\'></div>" );
});
',//onclick end
]); ?>
Controller (employeequalifications/create):
public function actionCreate($i)
{
$model = new EmployeeQualifications();
return $this->renderPartial('create',[
'model'=>$model,
]);
}
EmployeeQualifications View create:
<div class="employee-qualifications-create">
<h1><?= Html::encode($this->title) ?></h1>
<?= $this->render('_form', [
'model' => $model,
]) ?>
</div>
and the view _form is:
<div class="employee-qualifications-form">
<?php $form = ActiveForm::begin(); ?>
<?= $form->field($model, 'employee_qualification_owner_id')->textInput() ?>
<?= $form->field($model, 'employee_qualification_position')->textInput() ?>
<?= $form->field($model, 'employee_qualification_start_date')->textInput(['maxlength' => 255]) ?>
<?= $form->field($model, 'employee_qualification_end_date')->textInput(['maxlength' => 255]) ?>
<?= $form->field($model, 'employee_qualification_reason')->textInput(['maxlength' => 255]) ?>
<?= $form->field($model, 'employee_qualification_organisation')->textInput(['maxlength' => 255]) ?>
<?= $form->field($model, 'employee_qualification_town')->textInput(['maxlength' => 255]) ?>
<?= $form->field($model, 'employee_qualification_country')->textInput() ?>
<div class="form-group">
<? //Html::submitButton($model->isNewRecord ? 'Add' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<a href="javascript:void();" onclick="$(this).closest(".employee-qualifications-form").remove();">Remove</a>
<?php ActiveForm::end(); ?>
</div>
want to get rid of the ActiveForm in _form since I don’t need it.
then will move on validation of dynamically added fields.
I have added
<?= yii\jui\DatePicker::widget([‘name’ => ‘employee_qualification_start_date’, ‘clientOptions’ => [‘defaultDate’ => ‘2014-01-01’]]) ?>
in _form, but the calendar is not popping up… hmmm…
found this…
trying to implement it, I think it should work as I need 
Looks like it does, and also supports Datepicker widgets and first record validation.
still problems with datepicker on cloned
Nice, I’ll try that tomorrow. I’m guessing the validation works too.
I changed the concept so I don’t need it anymore, had too many problems with it