menu

Questions & Answers

The last item you chose in the list is selected in the radio button. How can one item be selected from each row?

The last item you chose in the list is selected in the radio button. How can one item be selected from each row?

<?php $i = 1; ?>
@foreach ($products as $product)

    <tr>
        <td scope="row">{{ $i++ }}</td>

        <td>{{ $product->name ?? '' }}</td>
        <td><img src="{{asset($product->image)}}" class="product-img-2" alt="product img"></td>
        <td>
            <div class="col-md-2">
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="status" value="active" {{($product->status  == 'active') ? 'checked' : '' }} id="Active">
                    <label class="form-check-label" for="Active">
                        active
                    </label>
                </div>
                <div class="form-check form-check-inline">
                    <input class="form-check-input" type="radio" name="status" value="deactive" {{ ($product->status == 'deactive') ? 'checked' : '' }} id="Deactive" >
                    <label class="form-check-label" for="Deactive">
                        deactive
                    </label>
                </div>
            </div>

        </td>

    </tr>


@endforeach

The last one selected is selected. I only want one item from each row to be selected

Comments:
2023-01-11 09:29:37
Welcome to Stack Overflow. Your question is a big vague in its meaning; could you edit it and include more info about your problem?
2023-01-11 09:29:37
All of the radio buttons have the same name, so they act as the same input. You'll need to set a different name for each item in the loop. The easiest might be to change the name to an array, and use the product id as the array key. name="status[{{$product->id}}]"
2023-01-11 09:29:37
While you're at it, make the ids unique too
Answers(1) :

If you want multiple radio button to be selected at the same time, they must have a different name attribute.

For example :

<!-- Row 1 -->
<input class="form-check-input" type="radio" name="status-row-1" value="active" id="Active" />
<input class="form-check-input" type="radio" name="status-row-1" value="deactive" />

<!-- Row 2 -->
<input class="form-check-input" type="radio" name="status-row-2" value="active" id="Active" />
<input class="form-check-input" type="radio" name="status-row-2" value="deactive" />

Also, here is a tip not related to your question, the id attributes should have a unique value, so a different one for all generated inputs.