如何將所選日期選擇器值從第一頁顯示到第二頁日期選擇器

Question

我正在酒店預訂網站上。 我在主頁上有基本表格，包括入住，退房，成人人數，兒童人數。 當用戶輸入這些詳細信息並單擊“立即預訂”時，將加載具有更多輸入字段的另一個頁面（預訂頁面）。 在此頁面上，我要顯示上一頁中選擇的值。 我可以顯示下拉值，但無法顯示前一頁到該頁面的datepicker字段中的datepicker值。 如何獲取日期選擇器值以顯示在第二頁日期選擇器字段上？ 謝謝你的幫助。

我試圖過帳日期選擇器的輸入字段中的值，但沒有用。 我可以將第一頁datepicker值作為文本獲取到POST，但不能在datepicker字段中獲取。

這是主頁上的日期選擇器輸入字段

<div class="booking_dropdown">
    <input type="text" class="datepicker booking_input booking_input_a booking_in" placeholder="Check in" required="required" name="checkin">
</div>
<div class="booking_dropdown">
    <input type="text" class="datepicker booking_input booking_input_a booking_out" placeholder="Check out" required="required" name="checkout">
</div>

這是第二頁日期選擇器輸入字段

<div class="booking_dropdown">
    <input type="text" id="checkin" class="datepicker booking_input booking_input_a booking_in" placeholder="Check in" required="required" name="checkin" value="<?php echo date_format(date_create($_POST['checkin']),"d/m/Y");?>">
</div>
<div class="booking_dropdown">
<input type="text" id="checkout" class="datepicker booking_input booking_input_a booking_out" placeholder="Check out" required="required" name="checkout" value="<?php echo date_format(date_create($_POST['checkout']),"d/m/Y");?>">
</div>

這是第二頁日期選擇器代碼- 更新

function initDatePicker()
{
   if($('.datepicker').length)
   {
      $("#checkin").datepicker({
         minDate: 0,
         onSelect: function (date) {
            var date2 = $('#checkin').datepicker('getDate');
            date2.setDate(date2.getDate());
            $('#checkout').datepicker('setDate', date2);
            //sets minDate to dt1 date + 1
            $('#checkout').datepicker('option', 'minDate', date2);
         }
      });

      $('#checkout').datepicker({
        onClose: function () {
           var dt1 = $('#checkin').datepicker('getDate');
           var dt2 = $('#checkout').datepicker('getDate');
           //check to prevent a user from entering a date below date of dt1
           if (dt2 <= dt1) {
              var minDate = $('#checkout').datepicker('option', 'minDate');
              $('#checkout').datepicker('setDate', minDate);
           }
        }
     });

   }
}

我希望從第一頁選擇的datepicker值顯示在第二頁datepicker字段上，但不會顯示第一頁datepicker值。 我希望日期格式為dd / mm / yyyy。

Answer 1

也許當您初始化jquery-ui-datepicker時，日期已被替換。

您可以嘗試第二頁的JavaScript：

$('#checkin').datepicker("setDate", new Date(<?php echo $_POST['checkin']; ?>) );

jQuery-UI datepicker默認日期

Answer 2

嘗試改變

<input type="text">

至

<input type="date">

在兩個頁面中

更新：對於jqueryui

<input type="text" value="<?php echo date_format(date_create($_POST['checkin']),"Y-m-d");?>">

更新2：

<input type="text" id="checkin" class="datepicker booking_input booking_input_a booking_in" name="checkin" value="<?php echo $_REQUEST["checkin"] ?>">
<input type="text" id="checkout" class="datepicker booking_input booking_input_a booking_in" name="checkout" value="<?php echo $_REQUEST["checkout"] ?>">