x
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<div>
<p class="text-[16px] mb-[8px]">
<strong> Date Of Birth </strong>
</p>
<div class="flex">
<div>
<label class="label" for="form_component_preview_test_model_form_component_preview_test_model_my_date_2i">Month</label><br>
<select name="form_component_preview_test_model[my_date(2i)]" id="form_component_preview_test_model_my_date_2i" class="mr-[8px] outline mt-[8px] h-[40px]"><option value="">- Select -</option><option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option></select>
</div>
<div>
<label class="label" for="form_component_preview_test_model_form_component_preview_test_model_my_date_3i">Day</label><br>
<input id="form_component_preview_test_model_my_date_3i" type="text" inputmode="numeric" minlength="1" maxlength="2" placeholder="DD" class="w-[48px] outline mr-[8px] mt-[8px] h-[40px] px-[8px]" size="2" name="form_component_preview_test_model[my_date(3i)]" />
</div>
<div>
<label class="label" for="form_component_preview_test_model_form_component_preview_test_model_my_date_1i">Year</label><br>
<input id="form_component_preview_test_model_my_date_1i" type="text" inputmode="numeric" minlength="4" maxlength="4" placeholder="YYYY" class="w-[72px] outline mr-[8px] mt-[8px] h-[40px] px-[8px]" size="4" name="form_component_preview_test_model[my_date(1i)]" />
</div>
</div>
</div>
1
2
3
4
5
6
7
8
render DatePickerComponent.new(form: form,
method: :my_date,
label: "Date Of Birth",
label_day: "Day",
label_month: "Month",
label_month_select: "- Select -",
label_year: "Year",
)