Radio Button group separately in yii2 without using radiolist - html

Question

I need Radio Button group in separate place in yii2 like in this question . I can customise the radio button like in this picture
but when I submit the form only the value of last radio is always submitted if last radio button is clicked respective value else null . I am not able to submit previous checked value.
mine form looks like
<div class="cart-form">
<?php $form = ActiveForm::begin(); ?>
<?= $form->field($model, 'product_id')->hiddenInput()->label(false) ?>
<?= $form->field($model, 'size_id')->dropDownList(
ArrayHelper::map(Productsize::find()->where(['product_id'=>$id])->all (), 'product_size_id', 'product_size' ),
[ 'prompt'=>'Select size',
'onchange'=>'
$.get( "'.Yii::$app->urlManager->createUrl('cart/lists?id=').'"+$(this).val(),
function( data ) {
$( "#pricetag11" ).val(data);
$( "#pricetaghtml" ).html(data);
});
']); ?>
<?php $colors = Productcolor::find()->where(['product_id'=>$id])->all(); ?>
<h4>Price:</h4> <p id="pricetaghtml" style="color:red;"></p>
Select size to see the price
<?php echo $form->field($model, 'price_id')->hiddenInput(['id'=>'pricetag11'])->label(false)?>
<!-- here is my problem -->
<h4>Color:</h4>
<?php foreach($colors as $color):?>
<div style="background-color:<?= $color->product_color;?>;width:20px;height:20px;padding-left:3px; display: inline-block"> <?= $form->field($model, 'color_id')->radio(['value' =>$color->product_color, 'label'=>'','uncheck'=>'null']); ?></div>
<?php endforeach;?>
<!-- -->
<?= $form->field($model, 'quantity')->textInput(['type' => 'number','min'=>'0','max'=>'9999' , 'placeholder'=>'0']) ?>
<div class="form-group">
<?= Html::submitButton($model->isNewRecord ? 'Create' : 'Update', ['class' => $model->isNewRecord ? 'btn btn-success' : 'btn btn-primary']) ?>
</div>
<?php ActiveForm::end(); ?>
</div>
In my scenario, I have to load color (hexcode) from database table and display in form and need to save the respective code in another table using radio button.
I have tried so many ways to accomplish this task in yii2 but i am not able. i hope someone will point me to the right direction.

Answer 1

I guess this will work,
<?= $form->field($model, 'color_id')->radioList(
$colors,
[
'item' => function($index, $label, $name, $checked, $value) {
$return = '<div style="background-color:'.$value.';width:20px;height:20px;padding-left:3px; display: inline-block">';
$return .= '<input type="radio" name="' . $name . '" value="' . $value . '">';
$return .= '</div>';
return $return;
}
]
)
->label(false); ?>