Track Order

<div>
<h2>Track Your Order</h2>
<form id="track-order-form">
<label for="order-number">Order Number:</label>
<input type="text" id="order-number" name="order-number" required>
<button type="submit">Track Order</button>
</form>
<div id="order-status"></div>
</div>

<script>
document.getElementById('track-order-form').addEventListener('submit', function(event) {
event.preventDefault();
var orderNumber = document.getElementById('order-number').value;

// 使用 AJAX 请求与您的订单跟踪 API 进行通信
fetch('https://example.com/track-order-api?order=' + orderNumber)
.then(response => response.json())
.then(data => {
var orderStatusDiv = document.getElementById('order-status');
if (data.success) {
orderStatusDiv.innerHTML = '<p>Order Status: ' + data.status + '</p>';
} else {
orderStatusDiv.innerHTML = '<p>Order not found. Please check your order number.</p>';
}
})
.catch(error => {
console.error('Error:', error);
var orderStatusDiv = document.getElementById('order-status');
orderStatusDiv.innerHTML = '<p>There was an error processing your request. Please try again later.</p>';
});
});
</script>