日期范围选择器和计算器
日期范围选择器和计算器
提问于 2018-12-13 06:37:04
我有一张酒店预订表，根据成人、老年人和学生的数量计算每人的价格。我想包括一个日期范围选择器，它将计算总成本取决于所选的天数，但当我包括第二个日历时，它不显示(没有下拉)。如何包含允许选择结束日期并计算总成本的第二个日历？
update_amounts();
$('select').change(update_amounts);
function update_amounts() {
var sum = 0.0;
$('#tickets > tbody > tr').each(function() {
var qty = $(this).find('option:selected').val();
var price = $(this).find('.price').text().replace(/[^\d.]/, '');
var amount = (qty * price);
sum += amount;
$(this).find('.subtotal').text('$' + amount);
});
$('#total').val('$' + sum);
$('#total').val('$')
};<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body>
<table>
<tbody>
<tr>
<td><strong>Adult</strong><a href="#" class="tooltip-1" data-placement="top" title="" data-original-title="16 - 65 years old"><sup class="icon-info-4"></sup></a>
<span class="price">3,400</span>
</td>
<td>
<div class="styled-select">
<select class="form-control" name="adults" id="adults">
<option value="">Select</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</div>
</td>
<td class="text-center"><span class="subtotal">ksh 0</span>
</td>
</tr>
<tr>
<td><strong>Senior</strong><a href="#" class="tooltip-1" data-placement="top" title="" data-original-title="Over 65 years old"><sup class="icon-info-4">
</sup></a><span class="price">3,400</span>
</td>
<td>
<div class="styled-select">
<select class="form-control" name="senior" id="senior">
<option value="">Select</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</div>
</td>
<td class="text-center"><span class="subtotal">$0</span>
</td>
</tr>
<tr>
<td><strong>Student >15 yrs</strong> <span class="price">2,000</span> </td>
<td>
<div class="styled-select">
<select class="form-control" name="student" id="student">
<option value="">Select</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</div>
</td>
<td class="text-center"><span class="subtotal">$0</span>
</td>
</tr>
</tbody>
</table>
<div class="form-group">
<label>From?</label>
<input type="text" class="form-control" id="date_pick" name="date_pick" data-date-format="M d, D" placeholder="Select a date">
<div class="form-group">
<label>To?</label>
<input type="text" class="form-control" id="date_pick" name="date_pick" data-date-format="M d, D" placeholder="Select a date">
</div>
<div class="form-group">
<label>Name and Lastname</label>
<input type="text" class="form-control" id="name_lastname_booking" name="name_lastname_booking" placeholder="Name and Lastname">
</div>
<div class="form-group">
<label>Email</label>
<input type="email" class="form-control" id="email_booking" name="email_booking" placeholder="Email">
</div>
<div class="form-group">
<label>Telephone</label>
<input type="text" class="form-control" id="telephone_booking" name="telephone_booking" placeholder="Telephone">
</div>
<div class="form-group add_bottom_30">
</div>
<div class="form-group">
<input type="submit" value="Book now" class="btn_full" id="submit-booking">
</div>
</form>
</body>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53752437
复制相关文章
相似问题