Capturing checkboxes with an array.

I have a form that contains a loop that displays a question and checkbox.

<form action="/vehicle_checks/{{$vehicle->id}}" method="POST" class="form-control">
            @csrf
            <label name="mileage" for="mileage">Please record the vehicle mileage.</label>
            <input type="number" name="mileage" class="form-control mb-2" required>

            @foreach($questions as $question)
                <div class="row">
                    <div class="col-8"><label for="answer[]" class="ml-2">{{$question->question}}</label></div>
                    <div class="col-4">
                        <div class="form_check form-check-inline">
                            <input class="mr-2" type="checkbox" name="answer[]" checked>Yes
                        </div>
                    </div>
                </div>
                <hr>
            @endforeach
            <label name="notes" for="notes"><strong>Record any notes if applicable.</strong></label>
            <textarea rows="5" class="form-control" name="notes"></textarea>
            <div class="row">
                <a href="/vehicle_checks/{{$vehicle->id}}" class="ml-auto btn btn-danger mt-3 mr-2">Cancel</a>
                <button type="submit" class="btn btn-success mt-3 mr-3">Save</button>
            </div>
        </form>

I an using answer[] to capture the status of the checkboxes but they only add to the array when set to "on" status. I need every value in the array with its on / off status so I can save the answer against the specific question. For example if someone saved the form without checking any checkbox, the answer array would contain 14 values of "off" (as that is currently the amount of questions), or if they just check question 3 then answer[2] would be set to "on";

Is there a way to do this?

arthvrian

7 years ago

Level 2

replace

<input class="mr-2" type="checkbox" name="answer[]" checked>Yes

With

<input class="mr-2" type="checkbox" name="answer[]" checked value="1">Yes

i think you must add a javascript event (un-check) to set value="0"

or you can run a loop over the answers in your store method and check if the answer array have these id (value="on")

click

7 years ago

Level 35

but they only add to the array when set to "on" status.

This is simply how checkboxes work. You only receive what is checked. There are quite some questions around this topic on this forum and on google. You should be able to find several solutions there.

In short, there are a few options:

"Sync" the data when you receive the data on the server. Depending on your models and relationships you could use the sync() method for this. This removes all existing relationships, adds new relationships and leaves existing untouched.
Do not use checkboxes. You can use radiobuttons with yes/no values.
Create a fake checkbox that actually sets the value of a hidden radiobutton to yes/no. This way it looks like a checkbox but you receive yes/no values on your server

jlrdw

7 years ago

Level 75

If only you knew how much easier it would be to deal with individual check boxes instead of a array

It can be a mess to have an edit form and figure out what's what.

But that's just the way I do it.

finchy70

7 years ago

Level 12

@click when using radio buttons they all share the answer[] name so only one button can be checked on the whole form.

Please or to participate in this conversation.