You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
384 lines
11 KiB
PHP
384 lines
11 KiB
PHP
<link href="/css/inquiry-form-mobile.css" rel="stylesheet">
|
|
<body>
|
|
<div id="formBanner">
|
|
<img src="https://data.asiahighlights.com/image/mobile-form-header.jpg"
|
|
src="little monk reading book" width="100%">
|
|
<h1>
|
|
Start Planning Your Trip
|
|
</h1>
|
|
<div class="howWeWork">
|
|
Tell us your interests and get replied within 24 hours...
|
|
</div>
|
|
</div>
|
|
<div class="container">
|
|
<div id="inquiryBox">
|
|
<h2>
|
|
Your Travel Ideas
|
|
</h2>
|
|
<div class="interestedRoute">
|
|
<div class="headerText">
|
|
INTERESTED ITINERARY
|
|
</div>
|
|
<div class="routeName">
|
|
<?php echo $ic_title;?>
|
|
</div>
|
|
</div>
|
|
<h3>
|
|
Destinations: <span class="destination"><?php foreach ($countryarr as $city){echo $city.',';}?></span>
|
|
</h3>
|
|
<input id="check" type="checkbox" class="hidden">
|
|
<div class="foldDestinations">
|
|
<div class="readMore">
|
|
<div class="selectionBlock">
|
|
<?php foreach ($countrylist as $moreCity){
|
|
echo '<div class="checkboxLabel">';
|
|
if(in_array($moreCity,$countryarr)){
|
|
echo '<input type="checkbox" value="'.$moreCity.'" id="'.$moreCity.'" name="destination[]" checked="checked" />';
|
|
}else{
|
|
echo '<input type="checkbox" value="'.$moreCity.'" id="'.$moreCity.'" name="destination[]" />';
|
|
}
|
|
echo '<label for="'.$moreCity.'" class="updatedestination">'.$moreCity.'</label></div>';
|
|
}?>
|
|
<span class="formMemo">
|
|
You are welcome to input other destinations below if it is not shown here.
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<label for="check" class="check-in">
|
|
Choose more destinations
|
|
<i class="fa fa-angle-down" aria-hidden="true">
|
|
</i>
|
|
</label>
|
|
<label for="check" class="check-out">
|
|
Fold
|
|
<i class="fa fa-angle-up" aria-hidden="true">
|
|
</i>
|
|
</label>
|
|
<div class="clear">
|
|
</div>
|
|
<div class="selectionBlock">
|
|
<h3>
|
|
Your hotel preference *
|
|
</h3>
|
|
<span class="formNote">
|
|
Hotels prices in Japan are at least doubled based on the suggested rates
|
|
below.
|
|
</span>
|
|
<form action="" method="GET">
|
|
<div class="optionLable">
|
|
<input type="radio" value="Luxury" id="fiveStar" name="hotel" value="Luxury (5 stars & up)">
|
|
<label for="fiveStar">
|
|
<div class="selectionText">
|
|
Luxury (5 stars & up)
|
|
<div class="selectionMemo">
|
|
USD 200+ / room / night
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="optionLable">
|
|
<input type="radio" value="Handpiched Comfort" id="fourStar" name="hotel" value="Standard (3 stars)">
|
|
<label for="fourStar">
|
|
<div class="selectionText">
|
|
Standard (3 stars)
|
|
<div class="selectionMemo">
|
|
USD 70-100 / room / night
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="optionLable">
|
|
<input type="radio" value="Standard" id="threeStar" name="hotel" value="Luxury (5 stars & up)">
|
|
<label for="threeStar">
|
|
<div class="selectionText">
|
|
Luxury (5 stars & up)
|
|
<div class="selectionMemo">
|
|
USD 200+ / room / night
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="selectionBlock">
|
|
<h3>
|
|
Number in your group *
|
|
</h3>
|
|
<div class="peopleSelect">
|
|
<span class="formMemo">
|
|
Adults (≥12 years old)
|
|
</span>
|
|
<input class="number" type="text" value="2" name="adultnumber" />
|
|
<div class="numberBtn">
|
|
<input class="minaddBtn reduceadult" type="button" value="-" />
|
|
<input class="minaddBtn addadult" type="button" value="+" />
|
|
</div>
|
|
</div>
|
|
<div class="peopleSelect">
|
|
<span class="formMemo">
|
|
Kids (2-11 years old)
|
|
</span>
|
|
<input class="number" type="text" value="0" name="kidnumber" />
|
|
<div class="numberBtn">
|
|
<input class="minaddBtn reducechild" type="button" value="-" />
|
|
<input class="minaddBtn addchild" type="button" value="+" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="selectionBlock">
|
|
<h3>
|
|
Your date of arrival *
|
|
</h3>
|
|
<input type="text" class="arrivalDate datepicker hidden-xs" id="Date_Start"
|
|
name="Date_Start" value="" placeholder="mm/dd/yyyy" autocomplete="off">
|
|
<input type="date" class="arrivalDate visible-xs" id="Date_Start" name="Date_Start_Mobile"
|
|
value="2019-12-19" min="2019-12-19" placeholder="mm/dd/yyyy" autocomplete="off">
|
|
<div class="checkYes">
|
|
<input type="checkbox" class="checkBorder" id="dateLimit" name="time">
|
|
<label for="dateLimit">
|
|
I'm flexible on the date
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="selectionBlock">
|
|
<h3>
|
|
Tell us more to help us put together your ideal journey.
|
|
</h3>
|
|
<form action="" method="GET" class="travelTag">
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="family" id="familytrip" name="grouptype">
|
|
<label for="familytrip">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Family
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="couple" id="cp" name="grouptype">
|
|
<label for="cp">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Couple
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="solo" id="single" name="grouptype">
|
|
<label for="single">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Solo
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="friends" id="mate" name="interests">
|
|
<label for="mate">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Friends
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="vacation" id="holiday" name="grouptype">
|
|
<label for="holiday">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Vacation
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="adventure" id="risk" name="interests">
|
|
<label for="risk">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Adventure
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="food" id="gourmet" name="interests">
|
|
<label for="gourmet">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Food
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="asiabeginner" id="firstasia" name="interests">
|
|
<label for="firstasia">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
First time to Asia
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="localculture" id="culture" name="interests">
|
|
<label for="culture">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Culture&History
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="travelStyle">
|
|
<input type="checkbox" value="relax" id="rest" name="interests">
|
|
<label for="rest">
|
|
<div class="smallTag">
|
|
<div class="styleText">
|
|
Rest&relaxation
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</form>
|
|
<textarea id="additionalrequirements" name="additionalrequirements" style="resize:none;"
|
|
placeholder="E.g. Age range, duration, group situation, special requests...">
|
|
</textarea>
|
|
</div>
|
|
<hr />
|
|
<h2>
|
|
Tell us about you...
|
|
</h2>
|
|
<div class="genderSelection">
|
|
<form action="" method="GET">
|
|
<div class="checkboxGender">
|
|
<input type="radio" value="Mr" id="male" name="gender">
|
|
<label for="male">
|
|
Mr.
|
|
</label>
|
|
</div>
|
|
<div class="checkboxGender">
|
|
<input type="radio" value="Ms" id="female" name="gender">
|
|
<label for="female">
|
|
Ms.
|
|
</label>
|
|
</div>
|
|
<div class="checkboxGender">
|
|
<input type="radio" value="Mx" id="neutural" name="gender">
|
|
<label for="neutural">
|
|
Mx.
|
|
</label>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="inputTerm">
|
|
<input type="text" name="name" required>
|
|
<label>
|
|
Full Name *
|
|
</label>
|
|
</div>
|
|
<div class="inputTerm">
|
|
<input type="email" name="email" required>
|
|
<label>
|
|
Email Address *
|
|
</label>
|
|
</div>
|
|
<span class="formMemo">
|
|
Your trip advisor will talk with you via email first.
|
|
</span>
|
|
<div class="inputTerm">
|
|
<input type="text" name="nationality" required>
|
|
<label>
|
|
Nationality *
|
|
</label>
|
|
</div>
|
|
<div class="inputTerm">
|
|
<input type="text" name="nationality" required>
|
|
<label>
|
|
Phone number
|
|
</label>
|
|
</div>
|
|
<span class="formMemo">
|
|
Area code + number. Only call if you ask.
|
|
</span>
|
|
<div class="checkYes">
|
|
<input type="checkbox" value="Available on WhatsApp" name="whatsapp" id="whatsapp"
|
|
class="checkBorder">
|
|
<label for="whatsapp">
|
|
This number is available on WhatsApp
|
|
</label>
|
|
</div>
|
|
<div class="inquiryBtn">
|
|
<input type="submit" value="Start My Journey">
|
|
</div>
|
|
<div class="contactUs">
|
|
<p>
|
|
Can't decide? Why not
|
|
<a href="https://www.asiahighlights.com/contact-us.htm">
|
|
contact us
|
|
</a>
|
|
for help!
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
<script>
|
|
$(function(){
|
|
var adultnums = $('input[name="adultnumber"]').val();
|
|
var kidnums = $('input[name="kidnumber"]').val();
|
|
//成人人数加减
|
|
$('.addadult').click(function(){
|
|
adultnums++;
|
|
$('input[name="adultnumber"]').val(adultnums);
|
|
});
|
|
|
|
$('.reduceadult').click(function(){
|
|
if(adultnums > 0){
|
|
adultnums--;
|
|
$('input[name="adultnumber"]').val(adultnums);
|
|
}
|
|
|
|
});
|
|
|
|
//加减儿童人数
|
|
$('.addchild').click(function(){
|
|
kidnums++;
|
|
$('input[name="kidnumber"]').val(kidnums);
|
|
});
|
|
|
|
$('.reducechild').click(function(){
|
|
if(kidnums > 0){
|
|
kidnums--;
|
|
$('input[name="kidnumber"]').val(kidnums);
|
|
}
|
|
|
|
});
|
|
|
|
//更新目的地
|
|
$('.updatedestination').click(function(){
|
|
var destinantionstr = '';
|
|
var selectdes = $(this).prev().val();
|
|
for(var i=0;i<$('input[name="destination[]"]').length-1;i++){
|
|
if(selectdes != $($('input[name="destination[]"]')[i]).val()){
|
|
if($($('input[name="destination[]"]')[i]).is(':checked')){
|
|
destinantionstr += $($('input[name="destination[]"]')[i]).val() + ',';
|
|
}
|
|
}
|
|
}
|
|
if($(this).prev().is(':checked')){
|
|
destinantionstr = destinantionstr.substr(0,destinantionstr.length-1);
|
|
}else{
|
|
destinantionstr += selectdes;
|
|
}
|
|
|
|
$('.destination').html(destinantionstr);
|
|
});
|
|
});
|
|
</script>
|