this is code in html :
<div class="col-9">
<form>
<div class="multiselect">
<div class="selectBox" onclick="showCheckboxes()">
<select>
<option placeholder="www"></option>
</select>
<div class="overSelect"></div>
</div>
<div id="checkboxes">
@foreach ($subjects as $subject)
<label for="itemform">
<input type="radio" value="{{ $subject->id }}"/>{{ $subject->name }}
</label>
@endforeach
</div>
@error('subjects')
<small class="form-text text-danger">{{ $message }}</small>
@enderror
</div>
</form>
</div>
and this is code in java script :
<script>
var expanded = false;
function showCheckboxes() {
var checkboxes = document.getElementById("checkboxes");
if (!expanded) {
checkboxes.style.display = "block";
expanded = true;
} else {
checkboxes.style.display = "none";
expanded = false;
}
}
</script>
My question is how can I choose to select only one item from the list given that I used the type is radio
3
Answers
Try this code,
use this script.
You need to use the "onclick" function in the HTML code.
For example:
This will allow the user to only select one radio button at a time. The function showCheckboxes() will ensure that only one box is checked.
Hope this helps!
Your label’s for attribute should be the same as your input’s ID attribute value.