人数选择修改,和其他表单保持一致

master
candice 2 years ago
parent 7c369b4b11
commit f1e44f67b1

@ -11,142 +11,206 @@
placeholder="E.g.: This is a big trip for anniversary, honeymoon, birthday celebration..."
style="height:80px;"></textarea>
<div class="selectionBlock" style="margin-bottom: 0;">
<h4 style="margin-top: 0; margin-bottom: 0px;">
Number in your group
</h4>
<div id="group_error_msg" style="display: none">
<div class="requiredArea" style="margin-top:-10px;">Please select number in your group.</div>
</div>
<div class="travel_group">
<input type="radio" value="Family" id="Family" name="travel_group">
<label for="Family" class="family">
Family
</label>
</div>
<div class="travel_group">
<input type="radio" value="Couple" id="Couple" name="travel_group">
<label for="Couple" class="couple">
Couple
</label>
</div>
<div class="travel_group">
<input type="radio" value="Solo" id="Solo" name="travel_group">
<label for="Solo" class="solo">
Solo
</label>
</div>
<div class="travel_group">
<input type="radio" value="group" id="Other" name="travel_group">
<label for="Other" class="group">
Other group
</label>
</div>
<div id="adultBlock" style="display: none">
<p style="
margin-bottom: 0;
font-size: 22px;
margin-top: 20px;
">When you plan to take the trip:</p>
<div class="peopleSelect">
<p style="margin-top: 20px;"><strong>
Adults (≥18 years old)
</strong> </p>
<button class="minaddBtn reduceadult" id="minusAdult" type="button" value="-">-</button>
<input class="number" type="text" value="2" id="adultNumber" name="adult">
<button class="minaddBtn addadult" type="button" id="plusAdult" value="+">+</button>
</div>
<div class="age_range">
<p>
Adults' ages
</p>
<div class="checkYes" style="float:left;">
<label for="65+">
<input type="checkbox" value="yes" name="age_65_plus" id="65+"
class="checkBorder">65+
</label>
</div>
<div class="checkYes" style="float:left;">
<label for="51-64">
<input type="checkbox" value="yes" name="age_51_64" id="51-64"
class="checkBorder">51-64
</label>
</div>
<div class="checkYes" style="float:left;">
<label for="41-50">
<input type="checkbox" value="yes" name="age_41_50" id="41-50"
class="checkBorder">41-50
</label>
</div>
<div class="checkYes" style="float:left;">
<label for="31-40">
<input type="checkbox" value="yes" name="age_31_40" id="31-40"
class="checkBorder">31-40
</label>
</div>
<div class="checkYes" style="float:left;">
<label for="18-30">
<input type="checkbox" value="yes" name="age_18_30" id="18-30"
class="checkBorder">18-30
</label>
</div>
</div>
</div>
<div class="clear"></div>
<div id="childrenBlock" style="display: none">
<p style="margin-top: 0; margin-top: 0;
margin-bottom: 5px;
font-size: 20px;"><strong>Children</strong></p>
<div class="kids_age">
<p style="margin-bottom: 5px;">10-17 yrs old</p>
<select class="kids_number" id="teenagerNumber" name="teenager_10_17_yrs">
<option value="0">0
</option>
<option value="1">1
</option>
<option value="2">2
</option>
<option value="3">3
</option>
<option value="4">4
</option>
</select>
</div>
<div class="kids_age">
<p style="margin-bottom: 5px;">3-9 yrs old</p>
<select class="kids_number" id="childrenNumber" name="children_3_9_yrs">
<option value="0">0
</option>
<option value="1">1
</option>
<div class="selectionBlock">
<h4 style="margin-bottom: 0;margin-top: 0; padding-bottom: 0;">
How would you travel?
</h4>
<div id="group_error_msg" style="display: none">
<div class="requiredArea" style="margin-top:-10px;">Please select number in your group.</div>
</div>
<div class="travel_group">
<input type="radio" value="Family" id="Family" name="travel_group">
<label for="Family" class="family">
Family
</label>
</div>
<div class="travel_group">
<input type="radio" value="Couple" id="Couple" name="travel_group">
<label for="Couple" class="couple">
Couple
</label>
</div>
<div class="travel_group">
<input type="radio" value="Solo" id="Solo" name="travel_group">
<label for="Solo" class="solo">
Solo
</label>
</div>
<div class="travel_group">
<input type="radio" value="group" id="Other" name="travel_group">
<label for="Other" class="group">
Other group
</label>
</div>
<option value="2">2
</option>
<option value="3">3
</option>
<option value="4">4
</option>
</select>
</div>
<div class="kids_age">
<p style="margin-bottom: 5px;">0-2 yrs old</p>
<select class="kids_number" id="infantNumber" name="infant_0_2_yrs">
<option value="0">0
</option>
<option value="1">1
</option>
<option value="2">2
</option>
<option value="3">3
</option>
<option value="4">4
</option>
</select>
</div>
</div>
<div id="adultBlock" style="display: none">
<p style="margin-top: 0;margin-bottom: 0;"><strong>Adults number</strong></p>
<div class="kids_age">
<p style="margin-bottom: 0;">65+ yrs old</p>
<select class="kids_number" id="adultNumber_65_plus" name="adult_65_plus" >
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
</select>
<p style="
margin-top: 5px;font-size: 18px;
">people</p>
</div>
<div class="kids_age">
<p style="margin-bottom: 0;">41-64 yrs old</p>
<select class="kids_number" id="adultNumber_41_64" name="adult_41_64" >
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
</select>
<p style="
margin-top: 5px;font-size: 18px;
">people</p>
</div>
<div class="kids_age">
<p style="margin-bottom: 0;">18-40 yrs old</p>
<select class="kids_number" id="adultNumber_18_40" name="adult_18_40" >
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
</select>
<p style="
margin-top: 5px;font-size: 18px;
">people</p>
</div>
</div>
<div class="clear"></div>
<div id="childrenBlock" style="display: none">
<p style="margin-top: 0;margin-bottom: 0;"><strong>Children number</strong></p>
<div class="kids_age">
<p style="margin-bottom: 5px;">10-17 yrs old</p>
<select class="kids_number" id="teenagerNumber" name="teenager_10_17">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<p style="
margin-top: 10px;font-size: 18px;
">people</p>
</div>
<div class="kids_age">
<p style="margin-bottom: 5px;">3-9 yrs old</p>
<select class="kids_number" id="childrenNumber" name="children_3_9">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<p style="
margin-top: 10px;font-size: 18px;
">people</p>
</div>
<div class="kids_age">
<p style="margin-bottom: 5px;">0-2 yrs old</p>
<select class="kids_number" id="infantNumber" name="infant_0_2">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<p style="
margin-top: 10px;font-size: 18px;
">people</p>
</div>
</div>
</div>
</div>
<div class="selectionBlock">
<h4>
When would you travel?

Loading…
Cancel
Save