xxxxxxxxxx1
<div class="col-md-6 col-12">2
3
<select name="frequencyType" id="frequencyType" class=" md-form mdb-select">4
<option value="">Please select</option>5
<option value="w">Once a week</option>6
<option value="y">Once a year</option>7
</select>8
<label for="frequencyType" class="mdb-main-label">Frequency:</label>9
10
<select name="frequencyAmount_w" id="frequencyAmount_w" class=" md-form mdb-select" title=" ">11
<option value="">Please select</option>12
13
<option value="1">Sun</option>14
15
<option value="2">Mon</option>16
17
<option value="3">Tue</option>18
19
<option value="4">Wed</option>20
21
<option value="5">Thu</option>22
23
<option value="6">Fri</option>24
25
<option value="7">Sat</option>26
27
</select>28
29
30
<select name="frequencyAmount_m" id="frequencyAmount_m" class=" md-form" title=" ">31
<option value="">Please select</option>32
33
<option value="1">On day 1 of each month</option>34
35
<option value="2">On day 2 of each month</option>36
37
<option value="3">On day 3 of each month</option>38
39
<option value="4">On day 4 of each month</option>40
41
<option value="5">On day 5 of each month</option>42
43
<option value="6">On day 6 of each month</option>44
45
<option value="7">On day 7 of each month</option>46
47
<option value="8">On day 8 of each month</option>48
49
<option value="9">On day 9 of each month</option>50
51
<option value="10">On day 10 of each month</option>52
53
<option value="11">On day 11 of each month</option>54
55
<option value="12">On day 12 of each month</option>56
57
<option value="13">On day 13 of each month</option>58
59
<option value="14">On day 14 of each month</option>60
61
<option value="15">On day 15 of each month</option>62
63
<option value="16">On day 16 of each month</option>64
65
<option value="17">On day 17 of each month</option>66
67
<option value="18">On day 18 of each month</option>68
69
<option value="19">On day 19 of each month</option>70
71
<option value="20">On day 20 of each month</option>72
73
<option value="21">On day 21 of each month</option>74
75
<option value="22">On day 22 of each month</option>76
77
<option value="23">On day 23 of each month</option>78
79
<option value="24">On day 24 of each month</option>80
81
<option value="25">On day 25 of each month</option>82
83
<option value="26">On day 26 of each month</option>84
85
<option value="27">On day 27 of each month</option>86
87
<option value="28">On day 28 of each month</option>88
89
<option value="29">On day 29 of each month</option>90
91
<option value="30">On day 30 of each month</option>92
93
<option value="31">On day 31 of each month</option>94
95
<!--<option value="99" >last</option>-->96
</select>97
98
<div class="md-form">99
<input id="frequencyDate" placeholder="Choose date" type="text" id="date-picker-example" class="form-control datepicker">100
<label for="date-picker-example">Choose date</label>101
</div>102
103
104
105
</div>xxxxxxxxxx1
#frequencyAmount_m,2
#frequencyAmount_w,3
#frequencyDate,4
#frequencyDate ~ label {5
display: none;6
}xxxxxxxxxx1
$(document).ready(function () {2
3
const $selectType = $("#frequencyType");4
const $selectWeek = $("#frequencyAmount_w");5
const $selectDate = $("#frequencyDate");6
const $label = $("#frequencyDate ~ label");7
8
$(".mdb-select").materialSelect();9
$selectWeek.materialSelect({ destroy: true });10
$selectType.change(function () {11
const frequencyType = $selectType.find("option:selected").val();12
13
if (frequencyType == 'w') {14
$selectDate.hide().removeClass("required");15
$label.hide();16
$selectWeek.materialSelect();17
} else if (frequencyType == 'y') {18
$('.datepicker').pickadate();19
$selectDate.show().addClass("required");20
$label.show();21
$selectWeek.materialSelect({ destroy: true });22
23
}24
});25
26
27
}); Console errors: 0