Please Note: that this section goes through some aspects of web development so a basic understanding of HTML and CSS will be beneficial.
To support date selection through individual select menus, all you need to do is apply some additional attributes.
Updating your Code
The below example will confuse the system and end up providing you with a comma separated list of values instead (we treat multiple fields of the same name as an array).
In order to make the system understand what you want it to do, you simply need to add two attributes to each input
<div data-field="F_5_DOB">
<label data-db-localized-content="F_5_DOB_LABEL"></label>
<div class="input">
<div class="date-menus">
<select name="F_5_DOB">
<option value="" disabled selected data-db-localized-content="F_5_DOB_DAY_PLACEHOLDER"></option>
</select>
<select name="F_5_DOB">
<option value="" disabled selected data-db-localized-content="F_5_DOB_MONTH_PLACEHOLDER"></option>
<option value="01" data-db-localized-content="MONTH_01_NAME_FULL"></option>
<option value="02" data-db-localized-content="MONTH_02_NAME_FULL"></option>
<option value="03" data-db-localized-content="MONTH_03_NAME_FULL"></option>
<option value="04" data-db-localized-content="MONTH_04_NAME_FULL"></option>
<option value="05" data-db-localized-content="MONTH_05_NAME_FULL"></option>
<option value="06" data-db-localized-content="MONTH_06_NAME_FULL"></option>
<option value="07" data-db-localized-content="MONTH_07_NAME_FULL"></option>
<option value="08" data-db-localized-content="MONTH_08_NAME_FULL"></option>
<option value="09" data-db-localized-content="MONTH_09_NAME_FULL"></option>
<option value="10" data-db-localized-content="MONTH_10_NAME_FULL"></option>
<option value="11" data-db-localized-content="MONTH_11_NAME_FULL"></option>
<option value="12" data-db-localized-content="MONTH_12_NAME_FULL"></option>
</select>
<select name="F_5_DOB">
<option value="" disabled selected data-db-localized-content="F_5_DOB_YEAR_PLACEHOLDER"></option>
</select>
</div>
</div>
</div>
Attribute: data-handler
Description: Tells us what behaviour to use for this field
Attribute: data-as
Description: Tells us what part of the behaviour is to be handled by this input
For date menus, the data-handler should be date-menus and each menu should specify if it is to be day, month or year.
We can populate the date menu with values from 1-31, notice that they are omitted in the example above, and hide any days not relevant based on the currently selected month/year combination.
We can also populate the year menu for you, and you can define what values are shown with two additional attributes
Attribute: data-from
Description: How many years (relative to this year) to start from, default 0
Attribute: data-to
Description: How many years (relative to this year) to go to, default -100
data-from
The defaults will show you a menu starting from the current year, descending to 1917 (at the time of writing).
Date Menus, with correct attributes for desired behaviour
<div data-field="F_5_DOB">
<label data-db-localized-content="F_5_DOB_LABEL"></label>
<div class="input">
<div class="date-menus">
<select name="F_5_DOB" data-as="day" data-handler="date-menus">
<option value="" disabled selected data-db-localized-content="F_5_DOB_DAY_PLACEHOLDER"></option>
</select>
<select name="F_5_DOB" data-as="month" data-handler="date-menus">
<option value="" disabled selected data-db-localized-content="F_5_DOB_MONTH_PLACEHOLDER"></option>
<option value="01" data-db-localized-content="MONTH_01_NAME_FULL"></option>
<option value="02" data-db-localized-content="MONTH_02_NAME_FULL"></option>
<option value="03" data-db-localized-content="MONTH_03_NAME_FULL"></option>
<option value="04" data-db-localized-content="MONTH_04_NAME_FULL"></option>
<option value="05" data-db-localized-content="MONTH_05_NAME_FULL"></option>
<option value="06" data-db-localized-content="MONTH_06_NAME_FULL"></option>
<option value="07" data-db-localized-content="MONTH_07_NAME_FULL"></option>
<option value="08" data-db-localized-content="MONTH_08_NAME_FULL"></option>
<option value="09" data-db-localized-content="MONTH_09_NAME_FULL"></option>
<option value="10" data-db-localized-content="MONTH_10_NAME_FULL"></option>
<option value="11" data-db-localized-content="MONTH_11_NAME_FULL"></option>
<option value="12" data-db-localized-content="MONTH_12_NAME_FULL"></option
</select>
<select name="F_5_DOB" data-as="year" data-handler="date-menus" data-from="" data-to="">
<option value="" disabled selected data-db-localized-content="F_5_DOB_YEAR_PLACEHOLDER"></option>
</select>
</div>
</div>
</div>