Radio Button group in separate place in yii2

Question

So, I want to have two radio button in separate place, I have been trying to search for the solution and everyone suggests to use radiolist which is not possible in my case.

If I put it like this (work_part_time button) : (below)

<div class="row">
    <div class="col-sm-2">
        <?= $form->field($model, 'work_part_time')->radio(['label' => 'yes', 'value' => 1])?>
    </div>-

    <div class="col-sm-3">
        <?= $form->field($model, 'hour_week')->textInput(['type' => 'number', 'placeholder' => 'Hour/Week'])->label(false)?>
    </div>

    <div class="col-sm-3">
        <?= $form->field($model, 'part_time_rate')->textInput(['type' => 'number', 'placeholder' => 'rate/hour(SGD)'])->label(false)?> 
    </div>
</div>

<div class="form-group">
    <?= $form->field($model, 'work_part_time')->radio( [0 => 'No'])->label('No')?>
</div>
<hr>
<div class="row">
    <div class="col-sm-2">
        <?= $form->field($model, 'work_part_time')->radio(['label' => 'yes', 'value' => 1])?>
    </div>-

    <div class="col-sm-3">
        <?= $form->field($model, 'hour_week')->textInput(['type' => 'number', 'placeholder' => 'Hour/Week'])->label(false)?>
    </div>

    <div class="col-sm-3">
        <?= $form->field($model, 'part_time_rate')->textInput(['type' => 'number', 'placeholder' => 'rate/hour(SGD)'])->label(false)?> 
    </div>
</div>

<div class="form-group">
    <?= $form->field($model, 'work_part_time')->radio( [0 => 'No'])->label('No')?>
</div>
<hr>

I only can get 0 for the value.

Anyone has found the solution for this?

Answer 1

Yii will assign a checked or unchecked value to the radio button depending on the value of the stored attribute, so if the value is 0 it will check the button that has the value 0. Your problem seems to have been the hidden input that Yii automatically generates. As others have suggested, you need to set this to null if you want more than one radio button for the same field.

If the user checks another button, then all other radio buttons with the same name will become unchecked. The name of the attribute is generated automatically by Yii when it creates the button. Try these for your radio buttons:

<?= $form->field($model, 'work_part_time')->radio(['label' => 'Option 1', 'value' => 1, 'uncheck' => null]) ?>
<?= $form->field($model, 'work_part_time')->radio(['label' => 'Option 2', 'value' => 0, 'uncheck' => null]) ?>
<?= $form->field($model, 'work_part_time')->radio(['label' => 'Option 3', 'value' => 2, 'uncheck' => null]) ?>
<?= $form->field($model, 'work_part_time')->radio(['label' => 'Option4', 'value' => 3, 'uncheck' => null]) ?>

Each button needs a different value, and this is the value that will be stored in your field when the record is saved.

There can only ever be one button checked, so if you have multiple buttons with the same value, and the same name, as you seem to have in your examples, then only the last one in the set will be checked. I don't know of a way round this. I suggest you use <formgroup> to split up your form into logical sections, each section relating to whether work_part_time is yes or no. You seem to have started doing this!

Answer 2

I've personally checked your code in my system. This code returning 0 or 1 (in respective of selection of radio button.) It's working Fine. You can use my code.

In below code, if you want to give label as Work part time or some other, put in ->label('Work Part Time');

.
. // Your code
<?= $form->field($model, 'work_part_time')->radioList([1 => 'yes', 0 => 'No'])->label('Work Part Time'); ?>  
.
. // Your code

AND

1) If you want to check 'Yes' as default checked radio button, then you have to assign like this <?php $model->status_id = 1?>

.
. // Your code
<?php $model->status_id = 1?>
<?= $form->field($model, 'work_part_time')->radioList([1 => 'yes', 0 => 'No'])->label('Work Part Time'); ?> 
.
. // Your code

2) If you want to check 'No' as default checked radio button, then you have to assign like this <?php $model->status_id = 0?>

.
. // Your code
<?php $model->status_id = 0?>
<?= $form->field($model, 'work_part_time')->radioList([1 => 'yes', 0 => 'No'])->label('Work Part Time'); ?>  
.
.//Your code

Answer 3

try this:

<?php echo $form->radioButton($model,'user_work_part_time',array('value'=>1,'uncheckValue'=>null)); 
$form->radioButton($model,'user_work_part_time',array('value'=>0,'uncheckValue'=>null)); 
?>

add 'uncheckValue'=>null in htmlOption array it will work.

Answer 4

If you substitute "uncheck" with "uncheckValue", the voted answer will work, except it will only post the value of the last radio on the list if selected and 0 for the rest. To make it work and post selected values as intended, I added some JS code to it. Hope it will help someone down the road.

<!-- Complete solution for Radio buttons on separate places Yii2 together with its JS function-->
<php use  yii\web\View; ?>
<?= $form->field($model, 'work_part_time')->radio(['label' => 'Option 1', 'value' => 1, 'uncheckValue' => null,'onChange'=>' if($(this).prop("checked")){ var radioValue = 1;$(this).val(radioValue); var radioName = "Model[work_part_time]"; RadioSelected(radioName,radioValue);}else{$(this).val("")};']) ?>
<?= $form->field($model, 'work_part_time')->radio(['label' => 'Option 2', 'value' => 0, 'uncheckValue' => null,'onChange'=>' if($(this).prop("checked")){ var radioValue = 0; $(this).val(radioValue); var radioName = "Model[work_part_time]"; RadioSelected(radioName,radioValue);}else{$(this).val("")};']) ?>
<?= $form->field($model, 'work_part_time')->radio(['label' => 'Option 3', 'value' => 2, 'uncheckValue' => null,'onChange'=>' if($(this).prop("checked")){ var radioValue = 2; $(this).val(radioValue); var radioName = "Model[work_part_time]"; RadioSelected(radioName,radioValue);}else{$(this).val("")};']) ?>
<?= $form->field($model, 'work_part_time')->radio(['label' => 'Option4', 'value' => 3, 'uncheckValue' => null,'onChange'=>' if($(this).prop("checked")){var radioValue = 3; $(this).val(radioValue);  var radioName = "Model[work_part_time]"; RadioSelected(radioName,radioValue);}else{$(this).val("")};']) ?>
<?php
//JS Function
$RadioONSeparatePlaceJS = <<<JS
function RadioSelected(radioName,radioValue)
{
   $('input[name="' + radioName + '"]').val(radioValue);
}

JS;
$this->registerJs($RadioONSeparatePlaceJS,View::POS_HEAD);
?>

Thank you for the great answer Joe Miller.