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?

Sassenach

i did not understand your question , what functionality you want using radio box. – Meek

Hi @AmiteshKumar, thanks for the response I want to separate two button in different place 1st row, Yes 2nd row, no without using radiolist – Sassenach

in your code you are using three radio button 1 for yes 2 for no ,then whats the problem ? – Meek

the problem is if i use the code above, i could not get the value, whichever i click (either yes or no) i will get 0 value – Sassenach

yes it will show you always zero. – Meek

then what should i do? i need to get the value which is 1 or 0 TT – Sassenach

Let us continue this discussion in chat. – Sassenach

Hi @RobertLimanto : You can try my code . It's working fine. I've checked. – Imperium

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!

Reform

I've amended my answer. I've tested this in my ide and it works ok, but note my comment about having three radio buttons in your form. – Reform

i actully tested the program using 6 buttons, will it work? – Sassenach

how do i suppose to make it for more than 2 button? – Sassenach

@RobertLimanto I'm still trying to work it out, it doesn't seem as intuitive as I'd thought. I think I've misunderstood something basic about how they work. I'll try and get back to you with some further investigations for your use case It's a puzzle! – Reform

@RobertLimanto I've expended my answer based on some tinkering I've been doing this afternoon. Hope it helps! – Reform

this will not pass the validation from model, i have tried this in my program and it is not working – Sassenach

i kind of put ['work_part_time'], required in model form – Sassenach

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

Imperium

Hi, i dont want to use radio List, because i want to separate both radios in different place – Sassenach

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.

Meek

Thanks kumar, it is still not working <?= $form->field($model, 'firstdegreescore')->radio(['label' => false, 'value' => '1' , 'uncheckValue' => null])?> <?= $form->field($model, 'firstdegreescore')->radio(['label' => false, 'value' => '2' , 'uncheckValue' => null])?> i am using yii2, so i did it in yii2 way – Sassenach

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.

Milli