使用 ajax 调用设置 jQuery datepicker 允许的时间答案

【问题标题】：Set jQuery datepicker allowed times with ajax call使用 ajax 调用设置 jQuery datepicker 允许的时间
【发布时间】：2016-02-06 17:35:23
【问题描述】：

我需要通过 ajax 调用设置 jQuery datepicker 插件允许的时间

这是我的 javascript：

var al = function(currentDateTime) {   
    $.post("getdate.php", function(data) {
        $('#default_datetimepicker').datetimepicker({
            allowTimes: data
        });
    });
};

$(function() {
    $('#default_datetimepicker').datetimepicker({
        allowTimes: [
            '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00',
            '17:00'
        ],
        formatTime: 'H:i',
        formatDate: 'd.m.Y',
        defaultTime: '08:00',
        onChangeDateTime: al,
        timepickerScrollbar: true
    });

这是我在“getdate.php”中的 php 代码。

<?php
    echo "'08:00', '09:00'";
?>

我试过了，

$times = array(
    '08:00', '09:00'
);

json_encode($times);

但是他们两个都没有工作......（我正在使用这个插件'http://xdsoft.net/jqplugins/datetimepicker/'）

【问题讨论】：

标签： php jquery datepicker

【解决方案1】：

如果您想通过 AJAX 调用获取属性的值，您必须确保在显示您的时间选择器之前您的调用将完成并成功。我认为这种方法会导致延迟...

我想到了另一种解决方案：

如果你想让 allowTimes 属性动态化，你可以将你的 HTML/JS 脚本放入一个 .php 文件中，然后在 php 中获取你想要的允许时间。

<?php
//index.php
//
// Put here your script to get the allowed times. You can store them in a database, and make a simple SELECT request.
$allowed_times= "['08:00', '09:00']";

?>
<!-- your HTML CODE -->

<!-- your HTML CODE -->

$(function() {
        $('#default_datetimepicker').datetimepicker({
            allowTimes: <?php echo $allowed_times; ?>,
            formatTime: 'H:i',
            formatDate: 'd.m.Y',
            defaultTime: '08:00',
            onChangeDateTime: al,
            timepickerScrollbar: true
        });

【讨论】：

感谢您的回答，但我需要一个 ajax 调用

【解决方案2】：

经过一番测试，我找到了答案。我们需要将这些添加到 ajax 调用参数中。

数据类型：“json”，
contentType: "application/json; charset=utf-8",

这是我的 js，

var al = function(currentDateTime) {

        $.ajax({
            url: 'getdate.php',
            type: 'POST',
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function(data) {
                alert(data);
                $('#default_datetimepicker').datetimepicker({
                    allowTimes: data
                });
            }
        });
    };

    $(function() {
        $('#default_datetimepicker').datetimepicker({
            allowTimes: [
                '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00',
                '17:00'
            ],
            formatTime: 'g:i A',
            formatDate: 'd.m.Y',
            defaultTime: '08:00',
            onChangeDateTime: al,
            timepickerScrollbar: true
        });

    });

这是我的 php，

<?php 
$times = array(
    '08:00', '09:00'
);
echo json_encode($times);
?>

【讨论】：