如何在日期选择器中仅启用预定日期

时间:2015-06-05 09:13:57

标签: php jquery mysqli

我的项目说明

我正在制作考勤管理系统。要求如下 1)首先,我需要制定一个时间表。 2)选择Schedule and Put attendance。

我从 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> 

如何在datepicker中仅启用预定日期,任何帮助都可能非常感谢。

1 个答案:

答案 0 :(得分:0)

你需要做的就是做这个棘手的第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启用你想要的日期;)