datepicker在表单重新加载后显示选定的值

时间:2017-06-27 22:21:18

标签: javascript php jquery datepicker

我在表单中输入了一个jquery datepicker。它正确显示当前日期作为初始值。我希望此日期选择器显示在提交表单后重新加载页面时选择的日期。但是现在,我只知道如何在value属性中回显当前日期。

这是AppointmentDateSelector.php中的datepicker表单:

<form method="POST">
    <div style='margin:0 auto; text-align:center;'>
        <label>Appointment Date: </label>
        <input type="text" id="datepicker" name="date" value=<?php echo date('m/d/Y');?> />
        <input type="hidden" name="action" value="list_appointments"/>
        <input type="hidden" name="date" value="Value of datepicker goes here?"/>
        <input type="submit" value="Refresh List" name="Update" />
        <br />
    </div>
</form>

和包含它的Scheduling.php页面。

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <!-- for datepicker -->
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
    <!-- for timepicker -->
    <script src="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.js"></script>
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/timepicker/1.3.5/jquery.timepicker.min.css">
    <script type="text/javascript">   
        $(document).ready(function(){
            $( "#datepicker" ).datepicker({minDate:'0',
            beforeShowDay:
                  function(dt)
                  {
                    return [dt.getDay() === 2 || dt.getDay() === 3, ""];
                  }});
            });
        $(document).ready(function(){
            $('input.timepicker').timepicker({
                timeFormat: 'h:mm p',
                interval: 30,
                minTime: '9',
                maxTime: '5:00pm',
                defaultTime: '9',
                startTime: '9:00',
                dynamic: false,
                dropdown: true,
                scrollbar: true                
            });
        });
    </script>  
</head>
<body>
    <?php 
    include('AppointmentDateSelector.php');

    // determine if we got a INPUT_POST or INPUT_GET...
    // if both NULL, then should default to 'list_appointments'
    $action = filter_input(INPUT_POST, 'action');   
    if ($action == NULL) 
    {
        $action = filter_input(INPUT_GET, 'action');
        if ($action == NULL) {
            $action = 'list_appointments'; 
        }
    }

    if ($action == 'list_appointments') 
    {
        $date = filter_input(INPUT_POST, 'date');

        $dateparse = date_parse($date); 
        #var_dump($dateparse);
        if (checkdate($dateparse['month'], $dateparse['day'], $dateparse['year'])) 
        {       
            // Get Appointment data
            $appointments = get_appointments($date);
            //header("Location: ./Scheduling.php?date=$date");

            // displays list of appointments on that date
            include('AppointmentList.php');
        }
        else
        {
            //Raise an error that says invalid date.
        }
    }               
    ?>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

您需要检查日期是否已提交,在这种情况下,请将其用作值:

<input type="text" id="datepicker" name="date" value="<?php echo (isset($_POST['date']) ? $_POST['date'] : date('m/d/Y')); ?>" />