【问题标题】:How to Enable only Scheduled Dates in date picker如何在日期选择器中仅启用预定日期
【发布时间】:2015-06-05 09:13:57
【问题描述】:

我的项目描述

我正在制作考勤管理系统。要求如下 1)首先我需要制定一个时间表。 2) 选择日程安排并安排出勤率。

我正在从 schedule.php 文件中获取以下值

 Array ( [schedulename] => Class for 1st year [subject] => Data Structure [university] => abc [facultyname] => Dr Rao [scheduleStartDate] => 2015-06-09 [scheduleEndDate] => 2015-06-18 [submit] => )

我的AddAttendance.php文件如下

    <?php
require_once 'config/config.php';
//require_once 'config/session.php';
require_once 'class/dbclass.php';
require_once 'class/StuRegister.php';
$stu = new StuRegister();
$AllList = $stu->AllList();
?>
<!DOCTYPE html>
<html>
     <head>
      <?php require_once 'config/commonJS.php'; ?>      
      <script>
        $(document).ready(function(){
            $( "#date" ).datepicker({
                currentText: "Now",
                dateFormat: 'yy-mm-dd',
                inline: true,
                altField: '#datepicker_value',
                onSelect: function(){
                getData();
                }   
            });
           var myDate = new Date();
           var prettyDate =myDate.getFullYear() +'-' + (myDate.getMonth()+1) + '-' + myDate.getDate();
           $("#datepicker_value").val(prettyDate);
        });
      </script>
      <script type="text/javascript">
        function getData(){
            //alert('Hi you have Selected Date');
            var dt = $("#datepicker_value").val();
            $.ajax({
                type: "POST",
                url: "process/processStuAttendance.php",
                data: {type:'get',date:dt},
                beforeSend : function () {
                    $('#wait').html("Loading");
                },
                success: function(resp){
                    var obj = jQuery.parseJSON(resp);
                    if(obj.sucess == 'new'){
                        $('.present').attr('checked',false);    
                    }else{
                        $('.present').attr('checked',false);
                        $(obj.data).attr('checked',true);
                    }
                },
                error: function(e){
                    alet('Please Try again form not submit sucessful');
                }
            });
        }   
        function setData(){
            if(!$('#formSubmit').validationEngine('validate')){

            }else{
                //alert('Hi setDate called');
                var absent = unCheckedStudent();
                var formVal = $('#formSubmit').serialize();
                if(absent != null){
                    formVal+="&absent="+absent;
                }
                $.ajax({
                    type: "POST",
                    url: "process/processStuAttendance.php",
                    data: formVal,
                    beforeSend : function () {
                        $('#wait').html("Loading");
                    },
                    success: function(resp){
                        alert('Sucessful'+resp);
                    },
                    error: function(e){
                        alet('Please Try again form not submit sucessful');
                    }
                });
            }
        }
        function unCheckedStudent(){
                //alert('Hi unCheckedStudent called');
                var ellength = document.formSubmit.elements.length;
                var absent = new Array();
                for(i=0;i<ellength;i++){
                      var type = document.formSubmit.elements[i].type;
                      var name = document.formSubmit.elements[i].name;
                      if (type=="checkbox" && name=="present[]" && document.formSubmit.elements[i].checked){
                      }
                      else if(type=="checkbox" && name=="present[]"){
                          absent.push(document.formSubmit.elements[i].value);
                      }
                }
                return absent;
        }

       </script>
      </head>
 <body>
  <div id="content-wrap">
   <div id="main">              
                <form name="formSubmit" class='form' id="formSubmit" method="post" >
                       <input type="hidden" name="type" value="<?php echo $sl_no == '' ? 'Add' : 'Update'; ?>">
                     <!-- <input type="text" onchange="getData(this.value)" class="validate[required]" readonly style="margin-left: 20px;" name="date" id="date" >-->
                        <input type="hidden" onchange="getData(this.value)" class="validate[required]" readonly style="margin-left: 20px;" name="date" id="datepicker_value" >
                            <div id="date" style="float: right;margin: 20px;"></div>    
                        <br/>
                        <br/>
                        <div style="float: left;margin: 20px;">
                        <table width="500px" class="tbl">
                            <tr><th><b>Present</b></th><th><b>Name</b></th><th><b>University</b></th></tr>
                            <?php
                            for ($i = 0; $i < count($AllList); $i++) {
                                echo "<tr>";
                                echo "<td><input id='{$AllList[$i]['sl_no']}' type='checkbox' name='present[]' class='present' value='{$AllList[$i]['sl_no']}'></td>";
                                echo "<td>{$AllList[$i]['student_name']}</td>";
                                echo "<td>{$AllList[$i]['university']}</td>";
                                echo "</tr>";
                            }
                            ?>
                        </table>
                        <input style="margin: 20px;cursor: pointer;" type="button" class="button" onclick="setData()" value="Save">
                        </div>    
                    </form>
    </div> 
   </div>
 </body>
</html> 

如何在日期选择器中仅启用预定日期,任何帮助都将不胜感激。

【问题讨论】:

  • 是的 Sulthan Allaaudeen 请检查头部的第一个脚本
  • 您要启用从scheduleStartDatescheduleEndDate 吗?
  • 是的 Sulthan Allaaudeen 你的权利

标签: php jquery mysqli


【解决方案1】:

你需要做的是完成这个棘手的 2 步

第 1 步:

列出您的开始日期和结束日期之间的日期

<?php
$scheduleStartDate = '2015-06-09';
$scheduleEndDate = '2015-06-18';
$Date = getDatesFromRange($scheduleStartDate,$scheduleEndDate);
$Date = substr($Date, 0, -1);

function getDatesFromRange($start, $end){
    $dates = array($start);
    $Value = '';
    while(end($dates) < $end)
    {
        $dates[] = date('Y-m-d', strtotime(end($dates).' +1 day'));
        $Value .= '"'.date('j-n-Y', strtotime(end($dates).' +1 day')).'",';
    }
    return $Value;
}
?>

第 2 步:

在你拥有的脚本中传递它,$Date 是你从 php 得到的那个

<script>
$( window ).load(function() {
var availableDates = [<?php echo $Date?>];
function available(date) {
  dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
  if ($.inArray(dmy, availableDates) != -1) {
    return [true, "","Available"];
  } else {
    return [false,"","unAvailable"];
  }
}

$('#date').datepicker({ beforeShowDay: available });
});
</script>

所以,最后你可以this code 来启用你想要的日期;)

【讨论】:

  • 非常感谢您的代码,onSelect: function(){getData();} 现在无法使用,请更新您的代码。
  • 我收到 Uncaught SyntaxError: Unexpected identifier error in console
  • 我打电话如下$('#date').datepicker({ beforeShowDay: available onSelect: function(){ getData(); } });
  • 现在它调用getData(); 函数,但我在控制台中得到Uncaught TypeError: Cannot read property 'sucess' of null
猜你喜欢
  • 2017-12-29
  • 1970-01-01
  • 1970-01-01
  • 2019-10-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-08-25
  • 2020-05-29
相关资源
最近更新 更多