javascript - 日期选择器上的 Jquery datesDisabled 不起作用

标签 javascript php jquery bootstrap-4 bootstrap-datepicker

我知道有很多关于它的主题,但在解决这个问题几天后我决定发布。 我需要在我的 Bootstrap 日期选择器中禁用日期,这里是 html 代码:

<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Noto+Sans" rel="stylesheet">
<link rel="stylesheet" href="../Css/css.css">
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>

<input type="text"  class="form-control" id="txt_dateDebut" value="<?php 
    echo $uneLocation->getDateDebut(); ?>" name="txt_dateDebut" required>

所以我在 Jquery 中尝试了很多解决方案但没有任何反应,这是一个:

    //disable these dates
var datesForDisable = ["25-01-2019", "26-01-2019", "27-01-2019"];

$("#txt_dateDebut").datepicker({
    format: 'dd/mm/yyyy',
    autoclose: true,
    weekStart: 1,
    calendarWeeks: true,
    todayHighlight: true,
    beforeShowDay: function(date){
        //format date in datepicker to dd-mm-yy
        var date1 = $.datepicker.formatDate('dd-mm-yy', date);
        //disable dates
        return [ datesForDisable.indexOf(date1) == -1 ]
    }
});

(一旦测试成功完成,目标是动态填充 PHP 禁用日期表)

最佳答案

您可以使用 beforeShowDay datepicker 禁用日期.i.e :

//disable these dates
var datesForDisable = ["25.01.2019", "26.01.2019", "27.01.2019"]

$("#txt_dateDebut").datepicker({
      format: 'dd/mm/yyyy',
      autoclose: true,
      weekStart: 1,
      calendarWeeks: true,
      todayHighlight: true,
      beforeShowDay: function(date){
       //format date in datepicker to dd-mm-yy
        var date1 = $.datepicker.formatDate('dd.mm.yy', date);
        //disable dates
        return [ datesForDisable.indexOf(date1) == -1 ]
       }
      });
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>

<input  type="text" class="form-control" id="txt_dateDebut" value="<?php echo $uneLocation->getDateDebut(); ?>" name="txt_dateDebut" required>

关于javascript - 日期选择器上的 Jquery datesDisabled 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57449552/

相关文章:

javascript - 为鼠标悬停链接添加 Fadein 到现有 CSS

php - 使用 php 变量执行查询

javascript - $.validator.setDefaults({ onkeyup : false }) to disable MVC3 onKeyup for Remote attribue 放在哪里

jQuery 输入字段中总时间的总和

javascript - NPM Mac OS 错误 : EACCES: permission denied, 访问 '/usr/local/lib/node_modules'

javascript - 使用带有异步获取变量的 react-apollo 调用 graphql 查询

javascript - 读取跨站点 iframe 位置

PHP 需要到达主父级

php - Mysqli 查询不执行

jquery - 使用 jquery 无法向表添加新行