Netlify Form Fieldest of Checkboxes Same Name Legend Not Used As Label

My form is served at [Lawn Care Service Estimate]

PLEASE DO NOT SUBMIT TO THIS FORM

I have a fieldset with multiple checkboxes but same name.

                    <fieldset>
                        <legend class="h6">Services</legend>
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" value="mowing" id="mowing" name="services[]">
                            <label class="form-check-label" for="mowing">
                                Weekly Lawn Mowing
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" value="cleanup" id="cleanup" name="services[]">
                            <label class="form-check-label" for="cleanup">
                                Yard Clean-up
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" value="beds" id="beds" name="services[]">
                            <label class="form-check-label" for="beds">
                                Flower Bed Preparation and Planting
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" value="mulching" id="mulching" name="services[]">
                            <label class="form-check-label" for="mulching">
                                Mulching
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" value="bushes" id="bushes" name="services[]">
                            <label class="form-check-label" for="bushes">
                                Brush Trimming and Pruning
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" value="lawn" id="lawn" name="services[]">
                            <label class="form-check-label" for="lawn">
                                Lawn Aeration and Seeding
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" value="leaves" id="leaves" name="services[]">
                            <label class="form-check-label" for="leaves">
                                Leaf Removal
                            </label>
                        </div>
                    </fieldset>

When my submissions arrive the label is the label from the first checkbox, but it should be the Fieldset Legend.

Hey @mikeritteronline,

This brought up in Multiple checkboxes with the same name are not handled correctly. There is (as mentioned in this thread) a bug report submitted for this.

A workaround is to handle form submission using a function and have this send to you via email.

2 Likes