HTML select validation

Hello,

I have added an HTML <select> directly to a form so that I could use the <optgroup> function to create sorted groups with headings. I have added a ‘required’ attribute to the <select> element, and have set a null value to the first option so that it acts as a placeholder. Unfortunately the null value isn’t being caught during validation and the form submits even if a selection is not made.

Would I be able to add custom validation to my functions files to return an error code on null submissions for this particular HTML select? I know very little PHP and tried referring to the Developer’s Cookbook but got lost very quickly. Would I have to create a custom form tag for it first before I can create a custom validation? Any guidance would be greatly appreciated.

The code in question is as follows:

<select required class="wpcf7-select" name="bond-type" id="bond-selection">
    <option value="" selected disabled hidden>- Choose Your Bond -</option>
    <optgroup label="Construction & Service Contracts">
        <option value="Bid Bond">Bid Bond (to bid on a new job)</option>
        <option value="Perf & Pmt">Performance & Payment Bond (for an awarded contract)</option>
        <option value="Maintenance">Stand Alone Maintenance Bond (for a warranty)</option>
        <option value="Supply">Supply Bond (for a supplier)</option>
    </optgroup>
    <optgroup label="Bond Line">
        <option value="Bond Line">Pre-Qualify for Contractors (determine my max limits)</option>
    </optgroup>
    <optgroup label="Commercial/License & Permit/Misc. Bonds">
        <option value="Gen Bus or Permit">General Business License or Permit Bond (not listed otherwise)</option>
        <option value="Auto">Auto/Motor Vehicle Dealer License Bond</option>
        <option value="Freight Broker">BMC-84 Freight Broker Bond (FMCSA compliance)</option>
        <option value="Contractor">Contractor License or Permit Bond</option>
        <option value="Collection">Collection Agency License Bond</option>
        <option value="Health/Gym/Spa">Health Club/Gym/Spa Bond</option>
        <option value="Insurance">Insurance Broker License Bond</option>
        <option value="Lost Title">Lost Title (for a vehicle)</option>
        <option value="Lottery">Lottery Bond</option>
        <option value="Medicare">Medicare/Medicaid Bond (CMS/DMEPOS)</option>
        <option value="Money Transm">Money Transmitter License Bond</option>
        <option value="Mortgage">Mortgage Broker/Banker License Bond</option>
        <option value="Tax">Tax Bonds (alcohol, fuel, tobacco, etc.)</option>
        <option value="Telemarket">Telemarketing/Solicitation License Bond</option>
        <option value="Union">Union Wage & Welfare Bond (union dues)</option>
        <option value="Utility">Utility Bonds (required for utility payments)</option>
    </optgroup>
</select>

• This topic was modified 6 years, 2 months ago by Sabina.

The page I need help with: [log in to see the link]