请帮助以正确编写日期选择器测试。 我有一个不可点击的字段,将在其中设置我选择的日期:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<form method="POST" action="">
<table>
<thead>
<th>Product</th>
<th>Price</th>
<th>Quantity</th>
<th>Width</th>
<th>Height</th>
<th>Total</th>
</thead>
<tbody id="product_table">
<tr>
<td><input type="text" name="product[]"></td>
<td><input type="text" name="price[]"></td>
<td><input type="text" name="quantity[]"></td>
<td><input type="text" name="width[]" value="0"></td>
<td><input type="text" name="height[]" value="0"></td>
<td><input type="text" name="total[]" class="totalPrice" readonly></td>
</tr>
<tr>
<td><input type="text" name="product[]"></td>
<td><input type="text" name="price[]"></td>
<td><input type="text" name="quantity[]"></td>
<td><input type="text" name="width[]" value="0"></td>
<td><input type="text" name="height[]" value="0"></td>
<td><input type="text" name="total[]" class="totalPrice" readonly></td>
</tr>
</tbody>
<button name="send">Submit</button>
</table>
</form>
</body>
<?php
include('database.php');
if (isset($_POST['send'])) {
$product = $_POST['product'];
$price = $_POST['price'];
$quantity = $_POST['quantity'];
$width = $_POST['width'];
$height = $_POST['height'];
$total = $_POST['total'];
$invoice_number = 1;
for($i=0; $i<count($_POST['total']); $i++) {
if($i <> count($_POST['total'])) {
$sql = "INSERT INTO invoice_order(invoice_number, product, price, quantity, width, height, total)
VALUES (".$invoice_number.",".$_POST['product'][$i].",".$_POST['price'][$i].",".$_POST['quantity'][$i].",".$_POST['width'][$i].",".$_POST['height'][$i].",".$_POST['total'][$i].")";
$query = mysqli_query($connect, $sql);
}}
if ($query) {
echo "Record inserted Successfully";
}else{
echo "Unable to insert Record";
}}?>
<script>
const table = document.getElementById('product_table');
table.addEventListener('input', ({ target }) => {
const tr = target.closest('tr');
const [product, price, quantity, width, height, total] = tr.querySelectorAll('input');
var size = width.value * height.value;
var rate = price.value * quantity.value;
var nameproduct = product.value;
if (size != "") {
total.value = size * rate;
}else{
total.value = rate;
}
totalPrice();
});
</script>
<style>
table,tr,td,th { border: 1px black solid;}
</style>
</html>
带有可打开日期格式的可点击按钮:
<input type="text" class="submit hasDatepicker" placeholder="License Expiry Date*"
name="website_field[bGl==]"
id="website_field_bGl" value="" size="16"
readonly="readonly">
月:
<img class="ui-datepicker-trigger" src="images/calendar.png" alt="Select date"
title="Select date">
年:
<select class="ui-datepicker-month" data-handler="selectMonth" data-
event="change"><option value="0">Jan</option></select> ...
和一个脚本:
<select class="ui-datepicker-year" data-handler="selectYear" data-
event="change"><option value="2000">2000</option></select> ...
我需要设置一个日期,例如:2020-07-14。
如何执行此操作? 谢谢。
我做了一些原始的工作。但是也许还有更多的“专业版”变体?:
$(function(){
$( "#website_field_bGljZW5zZSBleHBpcnkgZGF0ZQ"
).datepicker({
changeMonth: true,
changeYear: true,
firstDay:1,
dateFormat: "yy-mm-dd",
showOn: "button",
buttonImage: "images/calendar.png",
buttonImageOnly: true,
buttonText: "Select date",
minDate: "2000-01-01",
yearRange: "2000:+15"
}).attr("readonly", "readonly");
});