onselect 后刷新日期选择器

Posted 2023-05-09

【中文标题】onselect 后刷新日期选择器

【英文标题】：refresh datepicker after onselect

【发布时间】：2012-04-19 00:11:30

【问题描述】：

我正在为我的应用程序使用 jquery datepicker。

我想突出显示用户选择的日期。 用户将选择一个日期，该日期将作为假期添加到数据库中，并且该日期应突出显示。我已经在数据库中有一些日期，这些日期将在使用 beforeShowDay 事件之前突出显示，并且我还禁用了周末。

一切正常，只是在将日期添加到数据库后我无法突出显示该日期。只有当我重新加载日历时它才会突出显示。

我在互联网上搜索但没有任何明确的想法，建议在很多地方使用 multidatepicker 但重点是一次我只选择一个日期将其添加到数据库然后选择其他日期。

请建议我哪里出错了。 我的代码是--

var dates = [ <? php echo $holidays; ?> ];

$(document).ready(function () 
    $("#calendardisplay").datepicker(
        dateFormat: 'yy-mm-dd',
        beforeShowDay: highlightDays,
        onSelect: dateSelected
    );

    function dateSelected(dateText, inst) 
        $.post('/postChannelHoliday.php', 
            'date': dateText
        , function (data) 
            alert('Successfully Added');
        );
    


function holiday(date) 
    for (var i = 0; i < dates.length; i++) 
        if (new Date(dates[i]).toString().substr(0, 16) == date.toString().substr(0, 16)) 
            return [true, 'ui-state-highlight'];
        
    
    return [true, ''];


function highlightDays(date) 
    var noWeekend = $.datepicker.noWeekends(date);
    if (noWeekend[0]) 
        return holiday(date);
     else 
        return noWeekend;
    

);

我包含一个 php 文件来获取存储在数据库中的日期以在日历中突出显示它们

【问题讨论】：

你的缩进真的太可怕了。

var dates = [ <? php echo $holidays; ?> ]; 看起来很糟糕。你听说过json_encode()吗？您可以简单地使用 var dates = <?php echo json_encode($holidayArray); ?> ;，它始终是有效的 javascript - 无论数组包含什么。

@ThiefMaster - 但你能告诉我如何在不刷新的情况下突出显示用户在数据库中添加的那些日期，或者是否有必要在我的代码中刷新

@ThiefMaster - 抱歉缩进，感谢您建议使用 json_encode()。

为了将来参考，我建议将您的代码放在 jsfiddle.net 上并在此处链接到它，以便我们可以处理您的代码并更快地帮助您！

【参考方案1】：

您需要更新假期列表而不是 alert（看起来像 dates 全局对象），然后通过调用 refresh 来强制更新日期选择器。