客人护照信息收集表单改版
Jimmy Liow
2 years ago
parent
1d20327d11
commit
21a1df4a28
@ -0,0 +1,891 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>
|
||||||
|
Passport Information for All the Group Members
|
||||||
|
</title>
|
||||||
|
<meta content="width=device-width,minimum-scale=1,initial-scale=1" name="viewport">
|
||||||
|
<link href="https://data.chinahighlights.com/css/min.php?f=/css/customer_center_data/bootstrap.min.css,/css/customer_center_data/bootstrap-datetimepicker.min.css&v=202302061045" rel="stylesheet">
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
font-family: Calibri;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headerbar {
|
||||||
|
height: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnavigation {
|
||||||
|
width: 880px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#inquiryBox {
|
||||||
|
display: block;
|
||||||
|
background-color: #FFF;
|
||||||
|
padding: 50px;
|
||||||
|
border-radius: 4px;
|
||||||
|
width: 800px;
|
||||||
|
margin: 50px auto 35px auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.wholeWrap2 {
|
||||||
|
background: #000;
|
||||||
|
width: 100%;
|
||||||
|
display: inline-block;
|
||||||
|
margin-bottom: -4px;
|
||||||
|
padding-top: 40px;
|
||||||
|
padding-bottom: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 30px;
|
||||||
|
font-weight: 600;
|
||||||
|
margin: 10px 0 25px 0;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#inquiryBox h1 {
|
||||||
|
font-size: 33px;
|
||||||
|
margin: 0 0 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
font-size: 19px;
|
||||||
|
line-height: 22px;
|
||||||
|
padding: 15px;
|
||||||
|
border: 1px solid #d1d1d1;
|
||||||
|
background: #fff;
|
||||||
|
width: 95%;
|
||||||
|
height: 85px;
|
||||||
|
border-radius: 6px;
|
||||||
|
margin-top: 10px;
|
||||||
|
font-family: Calibri;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#name_error_msg,
|
||||||
|
#passport_error_msg,
|
||||||
|
#birth_error_msg,
|
||||||
|
#expiration_error_msg {
|
||||||
|
color: #ad1818;
|
||||||
|
font-size: 16px;
|
||||||
|
border-bottom: 1px dashed;
|
||||||
|
margin: 10px 0;
|
||||||
|
width: 100%;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inputTerm label {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 20px;
|
||||||
|
position: absolute;
|
||||||
|
left: 20px;
|
||||||
|
top: calc(50% - 13px);
|
||||||
|
transition: all ease-in-out .5s;
|
||||||
|
pointer-events: none;
|
||||||
|
height: 26px;
|
||||||
|
color: #999
|
||||||
|
}
|
||||||
|
|
||||||
|
.inputTerm {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
margin: 15px auto 0 auto;
|
||||||
|
position: relative
|
||||||
|
}
|
||||||
|
|
||||||
|
.inputTerm input:focus~label,
|
||||||
|
.inputTerm input:valid~label {
|
||||||
|
top: 5px;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #999;
|
||||||
|
transition: 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inputTerm input {
|
||||||
|
width: 94%;
|
||||||
|
margin: 0;
|
||||||
|
font-size: 22px;
|
||||||
|
border: 1px solid #d1d1d1;
|
||||||
|
height: 40px;
|
||||||
|
padding: 15px 15px 0 20px;
|
||||||
|
border-radius: 4px;
|
||||||
|
color: #000
|
||||||
|
}
|
||||||
|
|
||||||
|
button#tmsubmit {
|
||||||
|
background: #ad1818;
|
||||||
|
text-align: center;
|
||||||
|
display: table;
|
||||||
|
border-radius: 25px;
|
||||||
|
min-width: 30%;
|
||||||
|
margin: 50px auto;
|
||||||
|
padding: 10px 30px;
|
||||||
|
color: #FFF;
|
||||||
|
font-size: 22px;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.add_traveler_button {
|
||||||
|
font-size: 21px;
|
||||||
|
color: #ad1818;
|
||||||
|
padding: 8px;
|
||||||
|
border: 1px solid #d1d1d1;
|
||||||
|
border-radius: 4px;
|
||||||
|
width: 300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#Date_Start {
|
||||||
|
width: 310px;
|
||||||
|
font-size: 19px;
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 8px 15px 8px 60px;
|
||||||
|
color: #000;
|
||||||
|
border: 1px solid #d1d1d1;
|
||||||
|
height: 35px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
background: url(https://data.chinahighlights.com/pic/top10/tour-calendar.png) no-repeat 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.selectionBlock {
|
||||||
|
display: inline-block;
|
||||||
|
width: 398px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectionBlock p {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectionBlock input {
|
||||||
|
width: 350px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: 27px;
|
||||||
|
margin-top: 30px;
|
||||||
|
width: 100%;
|
||||||
|
display: inline-block;
|
||||||
|
font-weight: 400;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.datepicker.dropdown-menu {
|
||||||
|
font-size: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-size: 19px;
|
||||||
|
line-height: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
em {
|
||||||
|
color: #ad1818;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.datepicker table tr td.disabled,
|
||||||
|
.datepicker table tr td.disabled:hover {
|
||||||
|
background: none;
|
||||||
|
color: #999;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker table tr td.old,
|
||||||
|
.datepicker table tr td.new {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.datepicker table tr td.day:hover,
|
||||||
|
.datepicker table tr td.focused {
|
||||||
|
background: #ad1818;
|
||||||
|
cursor: pointer;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
select.country_code {
|
||||||
|
font-size: 18px;
|
||||||
|
color: #000;
|
||||||
|
height: 57px;
|
||||||
|
padding-left: 10px;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #d1d1d1;
|
||||||
|
width: 99%;
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p.top_info {
|
||||||
|
width: 860px;
|
||||||
|
margin: 0 auto;
|
||||||
|
color: #fff;
|
||||||
|
font-style: italic;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
font-size: 21px;
|
||||||
|
line-height: 27px;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
.traveler_info {
|
||||||
|
border-bottom: 3px dashed #d1d1d1;
|
||||||
|
padding-bottom: 50px;
|
||||||
|
margin-bottom: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.emergency_title {
|
||||||
|
font-size: 24px;
|
||||||
|
margin-top: -15px;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 27px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img-responsive {
|
||||||
|
overflow-x: auto;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 750px) {
|
||||||
|
img.asiahighlightslogo {
|
||||||
|
width: 210px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnavigation,
|
||||||
|
#inquiryBox,
|
||||||
|
p.top_info {
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
p.top_info,
|
||||||
|
img.asiahighlightslogo {
|
||||||
|
padding: 0 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
p.top_info {
|
||||||
|
font-size: 19px;
|
||||||
|
line-height: 23px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#inquiryBox {
|
||||||
|
padding: 30px 20px;
|
||||||
|
margin: 0 10px 40px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headerbar {
|
||||||
|
height: 53px;
|
||||||
|
}
|
||||||
|
|
||||||
|
select.country_code,
|
||||||
|
.selectionBlock {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#Date_Start {
|
||||||
|
width: 78%;
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea,
|
||||||
|
input.number,
|
||||||
|
.selectionBlock input {
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<header class="headerbar" id="header">
|
||||||
|
<div class="topnavigation">
|
||||||
|
<a href="/" class="p_toplogo" style="display: inline-block;"> <img
|
||||||
|
src="https://data.asiahighlights.com/pic/ah-bottom-logo-mobile.png" alt="Asiahighlights logo"
|
||||||
|
class="asiahighlightslogo img-responsive"></a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="wholeWrap2">
|
||||||
|
|
||||||
|
<p class="top_info">Dear <?php echo $username; ?>,</p>
|
||||||
|
|
||||||
|
<p class="top_info"> Thanks for booking with us. China Highlights, Asia Highlights, and Global Highlights are
|
||||||
|
working together to provide you an exclusive, exciting, and worry-free tour experience in different
|
||||||
|
destinations. </p>
|
||||||
|
|
||||||
|
<p class="top_info"> Please complete and submit the information below.</p>
|
||||||
|
|
||||||
|
<div class="tm_form_content">
|
||||||
|
|
||||||
|
<form action="https://www.chinahighlights.com/secureinfoconfirm/confirm/save_confirm_info" id="form-confirm-info" method="POST">
|
||||||
|
<div id="inquiryBox">
|
||||||
|
|
||||||
|
<h1>
|
||||||
|
Passport Information for All the Group Members
|
||||||
|
</h1>
|
||||||
|
<p>Please ensure the details you provide are correct, as stated in your passport. We use this
|
||||||
|
information to book all your hotels, transportation, and activities. If the information you
|
||||||
|
provide is incorrect, you would not be able to board your flight or trains, and therefore
|
||||||
|
reissuing of tickets would be at your expense!</p>
|
||||||
|
|
||||||
|
<div class="traveler_info">
|
||||||
|
<h3>Traveler 1</h3>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="sur_name[]" required="">
|
||||||
|
<label>
|
||||||
|
Sur name
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="given_name[]" required="">
|
||||||
|
<label>
|
||||||
|
Given name
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="name_error_msg" class="hidden">Please enter your name.</div>
|
||||||
|
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="passport[]" required="" class="number">
|
||||||
|
<label>
|
||||||
|
Passport No.
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div id="passport_error_msg" class="hidden">Please enter your passport number.</div>
|
||||||
|
|
||||||
|
<select class="country_code" name="nationality[]">
|
||||||
|
<option>Nationality</option>
|
||||||
|
<option value="United States">United States</option>
|
||||||
|
<option value="United Kingdom">United Kingdom</option>
|
||||||
|
<option value="Australia">Australia</option>
|
||||||
|
<option value="Canada">Canada</option>
|
||||||
|
<option value="France">France</option>
|
||||||
|
<option value="Germany">Germany</option>
|
||||||
|
<option value="Italy">Italy</option>
|
||||||
|
<option value="Mexico">Mexico</option>
|
||||||
|
<option value="Netherlands">Netherlands</option>
|
||||||
|
<option value="Singapore">Singapore</option>
|
||||||
|
<option value="Afghanistan">Afghanistan</option>
|
||||||
|
<option value="Albania">Albania</option>
|
||||||
|
<option value="Algeria">Algeria</option>
|
||||||
|
<option value="American Samoa">American Samoa</option>
|
||||||
|
<option value="Andorra">Andorra</option>
|
||||||
|
<option value="Angola">Angola</option>
|
||||||
|
<option value="Anguilla">Anguilla</option>
|
||||||
|
<option value="Antigua and Barbuda">Antigua and Barbuda</option>
|
||||||
|
<option value="Argentina">Argentina</option>
|
||||||
|
<option value="Armenia">Armenia</option>
|
||||||
|
<option value="Aruba">Aruba</option>
|
||||||
|
<option value="Ascension Island">Ascension Island</option>
|
||||||
|
<option value="Australia">Australia</option>
|
||||||
|
<option value="Austria">Austria</option>
|
||||||
|
<option value="Azerbaijan">Azerbaijan</option>
|
||||||
|
<option value="Bahamas">Bahamas</option>
|
||||||
|
<option value="Bahrain">Bahrain</option>
|
||||||
|
<option value="Bangladesh">Bangladesh</option>
|
||||||
|
<option value="Barbados">Barbados</option>
|
||||||
|
<option value="Belarus">Belarus</option>
|
||||||
|
<option value="Belgium">Belgium</option>
|
||||||
|
<option value="Belize">Belize</option>
|
||||||
|
<option value="Benin">Benin</option>
|
||||||
|
<option value="Bermuda">Bermuda</option>
|
||||||
|
<option value="Bhutan">Bhutan</option>
|
||||||
|
<option value="Bolivia">Bolivia</option>
|
||||||
|
<option value="Bosnia and Herzegovina">Bosnia and Herzegovina</option>
|
||||||
|
<option value="Botswana">Botswana</option>
|
||||||
|
<option value="Brazil">Brazil</option>
|
||||||
|
<option value="British Indian Ocean Territory">British Indian Ocean Territory</option>
|
||||||
|
<option value="British Virgin Islands">British Virgin Islands</option>
|
||||||
|
<option value="Brunei">Brunei</option>
|
||||||
|
<option value="Bulgaria">Bulgaria</option>
|
||||||
|
<option value="Burkina Faso">Burkina Faso</option>
|
||||||
|
<option value="Burundi">Burundi</option>
|
||||||
|
<option value="Cambodia">Cambodia</option>
|
||||||
|
<option value="Cameroon">Cameroon</option>
|
||||||
|
<option value="Canada">Canada</option>
|
||||||
|
<option value="Cape Verde">Cape Verde</option>
|
||||||
|
<option value="Caribbean Netherlands">Caribbean Netherlands</option>
|
||||||
|
<option value="Cayman Islands +1">Cayman Islands</option>
|
||||||
|
<option value="Central African Republic">Central African Republic</option>
|
||||||
|
<option value="Chad">Chad</option>
|
||||||
|
<option value="Chile">Chile</option>
|
||||||
|
<option value="China">China</option>
|
||||||
|
<option value="Christmas Island">Christmas Island</option>
|
||||||
|
<option value="Cocos Islands">Cocos Islands</option>
|
||||||
|
<option value="Colombia">Colombia</option>
|
||||||
|
<option value="Comoros">Comoros</option>
|
||||||
|
<option value="Congo">Congo (DRC)</option>
|
||||||
|
<option value="Congo">Congo (Republic)</option>
|
||||||
|
<option value="Cook Islands">Cook Islands</option>
|
||||||
|
<option value="Costa Rica">Costa Rica</option>
|
||||||
|
<option value="Côte d'Ivoire">Côte d'Ivoire</option>
|
||||||
|
<option value="Croatia">Croatia</option>
|
||||||
|
<option value="Cuba">Cuba</option>
|
||||||
|
<option value="Curaçao">Curaçao</option>
|
||||||
|
<option value="Cyprus">Cyprus</option>
|
||||||
|
<option value="Czech Republic">Czech Republic</option>
|
||||||
|
<option value="Denmark">Denmark</option>
|
||||||
|
<option value="Djibouti">Djibouti</option>
|
||||||
|
<option value="Dominica">Dominica</option>
|
||||||
|
<option value="Dominican Republic">Dominican Republic</option>
|
||||||
|
<option value="Ecuador">Ecuador</option>
|
||||||
|
<option value="Egypt">Egypt</option>
|
||||||
|
<option value="El Salvador">El Salvador</option>
|
||||||
|
<option value="Equatorial Guinea">Equatorial Guinea</option>
|
||||||
|
<option value="Eritrea">Eritrea</option>
|
||||||
|
<option value="Estonia">Estonia</option>
|
||||||
|
<option value="Eswatini">Eswatini</option>
|
||||||
|
<option value="Ethiopia">Ethiopia</option>
|
||||||
|
<option value="Falkland Islands">Falkland Islands</option>
|
||||||
|
<option value="Faroe Islands">Faroe Islands</option>
|
||||||
|
<option value="Fiji">Fiji</option>
|
||||||
|
<option value="Finland">Finland</option>
|
||||||
|
<option value="France">France</option>
|
||||||
|
<option value="French Guiana">French Guiana</option>
|
||||||
|
<option value="French Polynesia">French Polynesia</option>
|
||||||
|
<option value="Gabon">Gabon</option>
|
||||||
|
<option value="Gambia">Gambia</option>
|
||||||
|
<option value="Georgia">Georgia</option>
|
||||||
|
<option value="Germany">Germany</option>
|
||||||
|
<option value="Ghana ">Ghana</option>
|
||||||
|
<option value="Gibraltar">Gibraltar</option>
|
||||||
|
<option value="Greece ">Greece</option>
|
||||||
|
<option value="Greenland ">Greenland</option>
|
||||||
|
<option value="Grenada ">Grenada</option>
|
||||||
|
<option value="Guadeloupe ">Guadeloupe</option>
|
||||||
|
<option value="Guam ">Guam</option>
|
||||||
|
<option value="Guatemala ">Guatemala</option>
|
||||||
|
<option value="Guernsey ">Guernsey</option>
|
||||||
|
<option value="Guinea ">Guinea</option>
|
||||||
|
<option value="Guinea-Bissau ">Guinea-Bissau</option>
|
||||||
|
<option value="Guyana ">Guyana</option>
|
||||||
|
<option value="Haiti ">Haiti</option>
|
||||||
|
<option value="Honduras ">Honduras</option>
|
||||||
|
<option value="Hong Kong ">Hong Kong</option>
|
||||||
|
<option value="Hungary ">Hungary</option>
|
||||||
|
<option value="Iceland ">Iceland</option>
|
||||||
|
<option value="India ">India</option>
|
||||||
|
<option value="Indonesia ">Indonesia</option>
|
||||||
|
<option value="Iran ">Iran</option>
|
||||||
|
<option value="Iraq ">Iraq</option>
|
||||||
|
<option value="Ireland ">Ireland</option>
|
||||||
|
<option value="Isle of Man ">Isle of Man</option>
|
||||||
|
<option value="Israel ">Israel</option>
|
||||||
|
<option value="Italy ">Italy</option>
|
||||||
|
<option value="Jamaica ">Jamaica</option>
|
||||||
|
<option value="Japan ">Japan</option>
|
||||||
|
<option value="Jersey ">Jersey</option>
|
||||||
|
<option value="Jordan ">Jordan</option>
|
||||||
|
<option value="Kazakhstan ">Kazakhstan</option>
|
||||||
|
<option value="Kenya ">Kenya</option>
|
||||||
|
<option value="Kiribati ">Kiribati</option>
|
||||||
|
<option value="Kosovo ">Kosovo</option>
|
||||||
|
<option value="Kuwait ">Kuwait</option>
|
||||||
|
<option value="Kyrgyzstan ">Kyrgyzstan</option>
|
||||||
|
<option value="Laos ">Laos</option>
|
||||||
|
<option value="Latvia ">Latvia </option>
|
||||||
|
<option value="Lebanon ">Lebanon</option>
|
||||||
|
<option value="Lesotho ">Lesotho</option>
|
||||||
|
<option value="Liberia ">Liberia</option>
|
||||||
|
<option value="Libya ">Libya</option>
|
||||||
|
<option value="Liechtenstein ">Liechtenstein</option>
|
||||||
|
<option value="Lithuania ">Lithuania</option>
|
||||||
|
<option value="Luxembourg ">Luxembourg</option>
|
||||||
|
<option value="Macau ">Macau</option>
|
||||||
|
<option value="Macedonia ">Macedonia</option>
|
||||||
|
<option value="Madagascar ">Madagascar</option>
|
||||||
|
<option value="Malawi ">Malawi</option>
|
||||||
|
<option value="Malaysia ">Malaysia</option>
|
||||||
|
<option value="Maldives ">Maldives</option>
|
||||||
|
<option value="Mali ">Mali</option>
|
||||||
|
<option value="Malta ">Malta</option>
|
||||||
|
<option value="Marshall ">Marshall Islands</option>
|
||||||
|
<option value="Martinique ">Martinique</option>
|
||||||
|
<option value="Mauritania ">Mauritania</option>
|
||||||
|
<option value="Mauritius ">Mauritius</option>
|
||||||
|
<option value="Mayotte ">Mayotte</option>
|
||||||
|
<option value="Micronesia ">Micronesia</option>
|
||||||
|
<option value="Moldova ">Moldova</option>
|
||||||
|
<option value="Monaco ">Monaco</option>
|
||||||
|
<option value="Mongolia ">Mongolia</option>
|
||||||
|
<option value="Montenegro ">Montenegro</option>
|
||||||
|
<option value="Montserrat ">Montserrat</option>
|
||||||
|
<option value="Morocco ">Morocco</option>
|
||||||
|
<option value="Mozambique ">Mozambique</option>
|
||||||
|
<option value="Myanmar ">Myanmar</option>
|
||||||
|
<option value="Namibia ">Namibia</option>
|
||||||
|
<option value="Nauru ">Nauru</option>
|
||||||
|
<option value="Nepal ">Nepal</option>
|
||||||
|
<option value="New Caledonia ">New Caledonia</option>
|
||||||
|
<option value="New Zealand ">New Zealand</option>
|
||||||
|
<option value="Nicaragua ">Nicaragua</option>
|
||||||
|
<option value="Niger ">Niger</option>
|
||||||
|
<option value="Nigeria ">Nigeria</option>
|
||||||
|
<option value="Niue ">Niue</option>
|
||||||
|
<option value="Norfolk Island ">Norfolk Island</option>
|
||||||
|
<option value="North Korea ">North Korea</option>
|
||||||
|
<option value="Northern Mariana Islands ">Northern Mariana Islands</option>
|
||||||
|
<option value="Norway ">Norway</option>
|
||||||
|
<option value="Oman ">Oman</option>
|
||||||
|
<option value="Pakistan ">Pakistan</option>
|
||||||
|
<option value="Palau ">Palau</option>
|
||||||
|
<option value="Palestine ">Palestine </option>
|
||||||
|
<option value="Panama ">Panama </option>
|
||||||
|
<option value="Papua New Guinea ">Papua New Guinea</option>
|
||||||
|
<option value="Paraguay ">Paraguay</option>
|
||||||
|
<option value="Peru ">Peru </option>
|
||||||
|
<option value="Philippines ">Philippines</option>
|
||||||
|
<option value="Poland ">Poland</option>
|
||||||
|
<option value="Portugal ">Portugal</option>
|
||||||
|
<option value="Puerto Rico ">Puerto Rico</option>
|
||||||
|
<option value="Qatar ">Qatar</option>
|
||||||
|
<option value="Réunion ">Réunion</option>
|
||||||
|
<option value="Romania ">Romania</option>
|
||||||
|
<option value="Russia ">Russia</option>
|
||||||
|
<option value="Rwanda ">Rwanda</option>
|
||||||
|
<option value="Saint Barthélemy ">Saint Barthélemy</option>
|
||||||
|
<option value="Saint Helena ">Saint Helena</option>
|
||||||
|
<option value="Saint Kitts and Nevis ">Saint Kitts and Nevis</option>
|
||||||
|
<option value="Saint Lucia ">Saint Lucia</option>
|
||||||
|
<option value="Saint Martin ">Saint Martin</option>
|
||||||
|
<option value="Saint Pierre and Miquelon ">Saint Pierre and Miquelon</option>
|
||||||
|
<option value="Saint Vincent and the Grenadines ">Saint Vincent and the Grenadines</option>
|
||||||
|
<option value="Samoa ">Samoa</option>
|
||||||
|
<option value="San Marino ">San Marino</option>
|
||||||
|
<option value="São Tomé and Príncipe ">São Tomé and Príncipe</option>
|
||||||
|
<option value="Saudi Arabia ">Saudi Arabia </option>
|
||||||
|
<option value="Senegal ">Senegal</option>
|
||||||
|
<option value="Serbia ">Serbia</option>
|
||||||
|
<option value="Seychelles ">Seychelles</option>
|
||||||
|
<option value="Sierra Leone ">Sierra Leone</option>
|
||||||
|
<option value="Sint Maarten ">Sint Maarten</option>
|
||||||
|
<option value="Slovakia ">Slovakia</option>
|
||||||
|
<option value="Slovenia ">Slovenia</option>
|
||||||
|
<option value="Solomon Islands ">Solomon Islands</option>
|
||||||
|
<option value="Somalia ">Somalia</option>
|
||||||
|
<option value="South Africa ">South Africa</option>
|
||||||
|
<option value="South Korea ">South Korea</option>
|
||||||
|
<option value="South Sudan ">South Sudan</option>
|
||||||
|
<option value="Spain ">Spain</option>
|
||||||
|
<option value="Sri Lanka ">Sri Lanka</option>
|
||||||
|
<option value="Sudan ">Sudan</option>
|
||||||
|
<option value="Suriname">Suriname</option>
|
||||||
|
<option value="Svalbard and Jan Mayen ">Svalbard and Jan Mayen</option>
|
||||||
|
<option value="Sweden ">Sweden</option>
|
||||||
|
<option value="Switzerland ">Switzerland</option>
|
||||||
|
<option value="Syria ">Syria</option>
|
||||||
|
<option value="Taiwan ">Taiwan</option>
|
||||||
|
<option value="Tajikistan ">Tajikistan</option>
|
||||||
|
<option value="Tanzania ">Tanzania</option>
|
||||||
|
<option value="Thailand ">Thailand</option>
|
||||||
|
<option value="Timor-Leste ">Timor-Leste</option>
|
||||||
|
<option value="Togo ">Togo</option>
|
||||||
|
<option value="Tokelau ">Tokelau</option>
|
||||||
|
<option value="Tonga ">Tonga</option>
|
||||||
|
<option value="Trinidad and Tobago ">Trinidad and Tobago</option>
|
||||||
|
<option value="Tunisia ">Tunisia</option>
|
||||||
|
<option value="Turkey ">Turkey</option>
|
||||||
|
<option value="Turkmenistan ">Turkmenistan</option>
|
||||||
|
<option value="Turks and Caicos Islands ">Turks and Caicos Islands</option>
|
||||||
|
<option value="Tuvalu ">Tuvalu</option>
|
||||||
|
<option value="U.S. Virgin Islands ">U.S. Virgin Islands</option>
|
||||||
|
<option value="Uganda">Uganda</option>
|
||||||
|
<option value="Ukraine ">Ukraine</option>
|
||||||
|
<option value="United Arab Emirates ">United Arab Emirates </option>
|
||||||
|
<option value="United Kingdom ">United Kingdom</option>
|
||||||
|
<option value="United States ">United States</option>
|
||||||
|
<option value="Uruguay ">Uruguay</option>
|
||||||
|
<option value="Uzbekistan ">Uzbekistan</option>
|
||||||
|
<option value="Vanuatu ">Vanuatu</option>
|
||||||
|
<option value="Vatican City ">Vatican City</option>
|
||||||
|
<option value="Venezuela ">Venezuela</option>
|
||||||
|
<option value="Vietnam ">Vietnam</option>
|
||||||
|
<option value="Wallis and Futuna ">Wallis and Futuna</option>
|
||||||
|
<option value="Western Sahara ">Western Sahara </option>
|
||||||
|
<option value="Yemen ">Yemen</option>
|
||||||
|
<option value="Zambia ">Zambia</option>
|
||||||
|
<option value="Zimbabwe ">Zimbabwe</option>
|
||||||
|
<option value="Åland Islands ">Åland Islands</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<p> Date of birth</p>
|
||||||
|
|
||||||
|
<input type="text" class="arrivalDate datepicker hidden-xs"
|
||||||
|
name="birthday[]" value="" placeholder="mm/dd/yyyy" autocomplete="off">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<p> Date of expiration </p>
|
||||||
|
|
||||||
|
<input type="text" class="arrivalDate datepicker hidden-xs"
|
||||||
|
name="passport_expiration_date[]" value="" placeholder="mm/dd/yyyy" autocomplete="off">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div id="birth_error_msg" class="hidden">Please select your date of birth.</div>
|
||||||
|
<div id="expiration_error_msg" class="hidden">Please select your date of passport expiration.</div>
|
||||||
|
|
||||||
|
<select class="country_code" name="occupation[]">
|
||||||
|
<option>Occupation (optional)</option>
|
||||||
|
<option value="Professional">Professional</option>
|
||||||
|
<option value="Professor or similar">Professor or similar</option>
|
||||||
|
<option value="Retired person">Retired person</option>
|
||||||
|
<option value="Business owner">Business owner</option>
|
||||||
|
<option value="Government official">Government official</option>
|
||||||
|
<option value="Housewife">Housewife</option>
|
||||||
|
<option value="Self-emloyed person">Self-emloyed person</option>
|
||||||
|
<option value="Others">Others</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<button class="add_traveler_button" type="button">+ Add a traveler</button>
|
||||||
|
</div>
|
||||||
|
<div id="inquiryBox">
|
||||||
|
<h2>Your contact information (optional)</h2>
|
||||||
|
<p>Having a phone number, especially with WhatsApp/iMessage capability will help us contact you in
|
||||||
|
case of emergency.</p>
|
||||||
|
|
||||||
|
<p>Phone No.</p>
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Phone" required="" class="number">
|
||||||
|
<label>
|
||||||
|
including country code and area code
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<p>Home address</p>
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="street" required="">
|
||||||
|
<label>
|
||||||
|
Street
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="city" required="">
|
||||||
|
<label>
|
||||||
|
City
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="state" required="">
|
||||||
|
<label>
|
||||||
|
State
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="country" required="">
|
||||||
|
<label>
|
||||||
|
Country
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="inquiryBox">
|
||||||
|
<h2>Your Flight Information (optional)</h2>
|
||||||
|
<p>Your flight information will be forwarded to your guide/driver for airport pick up and drop off.
|
||||||
|
Please ensure the details you provide are correct. You can skip this if your don't need airport
|
||||||
|
transfer service.</p>
|
||||||
|
|
||||||
|
<div class="selectionBlock">
|
||||||
|
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Arrival flight No." required="">
|
||||||
|
<label>
|
||||||
|
Arrival flight No.
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Arrival time" required="">
|
||||||
|
<label>
|
||||||
|
Arrival time
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Departure Flight No." required="">
|
||||||
|
<label>
|
||||||
|
Departure Flight No.
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Departure time" required="">
|
||||||
|
<label>
|
||||||
|
Departure time
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="inquiryBox">
|
||||||
|
<h2>Your Special Request (optional)</h2>
|
||||||
|
<p></p>
|
||||||
|
<textarea id="additionalrequirements" name="Special Request" style="resize:none;"></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="inquiryBox">
|
||||||
|
<h2>Emergency Contact Information (optional)</h2>
|
||||||
|
<div class="emergency_title">(in case an unlikely event happens when you are travelling)</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Emergency Contact name" required="">
|
||||||
|
<label>
|
||||||
|
Contact person's name
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Emergency Contact Email" required="">
|
||||||
|
<label>
|
||||||
|
Email address
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<p>Relationship with him/her</p>
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Relationship" required="">
|
||||||
|
<label>
|
||||||
|
eg: He's Sue's father.
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="selectionBlock">
|
||||||
|
<p>Telephone No.</p>
|
||||||
|
<div class="inputTerm">
|
||||||
|
<input type="text" name="Emergency Contact Telephone No." required="">
|
||||||
|
<label>
|
||||||
|
including country code and area code
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="inquiryBox">
|
||||||
|
<h2>Your Insurance Information (Optional)</h2>
|
||||||
|
<textarea id="additionalrequirements" name="Insurance Information" style="resize:none;"></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="inquiryBtn">
|
||||||
|
<button id="tmsubmit" type="button" onclick="show_review_modal();">Check & Submit</button>
|
||||||
|
<input id="passport_info" name="passport_info" type="hidden" value="" />
|
||||||
|
<input type="hidden" name="url" value="" />
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- reviewModal -->
|
||||||
|
<div class="modal fade" id="reviewModal" tabindex="-1" role="dialog">
|
||||||
|
<div class="modal-dialog" role="document">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||||
|
<h4 class="modal-title text-danger">Please double check your information</h4>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body" id="reviewModal_body">
|
||||||
|
<p>...</p>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" class="btn btn-default" data-dismiss="modal">Return & Change</button>
|
||||||
|
<button type="button" class="btn btn-primary" id="btn-add-userinfo" onclick="show_review_modal();">Confirm & Submit</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- reviewModal end-->
|
||||||
|
<script src="https://data.chinahighlights.com/js/min.php?f=/js/customer_center_data/jquery.min.js,/js/customer_center_data/bootstrap.min.js,/js/customer_center_data/jquery-ui.min.js,/js/customer_center_data/jquery-ui-timepicker-addon.js&v=2019092401"></script>
|
||||||
|
<script>
|
||||||
|
function submit_info_form () {
|
||||||
|
var $btn = $("#btn-add-userinfo").button('loading');
|
||||||
|
var data = $("#form-confirm-info").serialize();
|
||||||
|
var url = $("#form-confirm-info").attr('action');
|
||||||
|
|
||||||
|
$.ajax({
|
||||||
|
type: "post",
|
||||||
|
url: url,
|
||||||
|
dataType: "json",
|
||||||
|
data: data,
|
||||||
|
success: function(json_data) {
|
||||||
|
if (json_data.status == 'ok') {
|
||||||
|
location.href = 'https://www.chinahighlights.com/secureinfoconfirm/confirm/index';
|
||||||
|
} else {
|
||||||
|
$('#myModal').modal('show');
|
||||||
|
$btn.button('reset');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
error: function(XMLHttpRequest, textStatus, errorThrown) {
|
||||||
|
alert(errorThrown);
|
||||||
|
$btn.button('reset');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
function show_review_modal() {
|
||||||
|
// if (verifyInfo() == false) {
|
||||||
|
// return false;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// $('#reviewModal_body').html('loading....');
|
||||||
|
console.info($("#form-confirm-info").serialize());
|
||||||
|
$.ajax({
|
||||||
|
type: "post",
|
||||||
|
dataType: "json",
|
||||||
|
data: $("#form-confirm-info").serialize(),
|
||||||
|
url: 'https://www.chinahighlights.com/secureinfoconfirm/confirm/review',
|
||||||
|
success: function(data, textStatus) {
|
||||||
|
$('#reviewModal_body').html(data);
|
||||||
|
$('#reviewModal').modal('show');
|
||||||
|
},
|
||||||
|
error: function(msg) {
|
||||||
|
alert('\u53d1\u751f\u9519\u8bef\uff0c\u8bf7\u8054\u7cfbYCC...');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
$(function () {
|
||||||
|
$('.datepicker').datepicker({
|
||||||
|
controlType: 'select',
|
||||||
|
oneLine: true,
|
||||||
|
changeMonth: true,
|
||||||
|
changeYear: true,
|
||||||
|
yearRange: '2010:2055',
|
||||||
|
timeFormat: 'mm/dd/yy'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Loading…
Reference in New Issue