創建日曆可用性按鈕

如果我想爲日曆創建可用性，我應該怎麼做？意思是，在用戶點擊日期後他們可以知道日期是否可用。現在，我的代碼在用戶點擊時正在運行，表單將出現。希望你們能幫助我。創建日曆可用性按鈕

<body> 
 

 
    
 
      <!-- /.navbar-collapse --> 
 
     </div> 
 
     <!-- /.container --> 
 
    </nav> 
 

 
    <!-- Page Content --> 
 
    <div class="container"> 
 

 
     <div class="row"> 
 
      <div class="col-lg-12 text-center"> 
 
       <img src="img/h3.png" alt="header"> 
 
\t 
 
       <div id="calendar" class="col-centered"> 
 
       </div> 
 
      </div> 
 
\t \t \t 
 
     </div> 
 
     <!-- /.row --> 
 
\t \t 
 
\t \t <!-- Modal --> 
 
\t \t <div class="modal fade" id="ModalAdd" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
 
\t \t <div class="modal-dialog" role="document"> 
 
\t \t \t <div class="modal-content"> 
 
\t \t \t <form class="form-horizontal" method="POST" action="addEvent.php"> 
 
\t \t \t 
 
\t \t \t <div class="modal-header"> 
 
\t \t \t \t <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
 
\t \t \t \t <h4 class="modal-title" id="myModalLabel">Car rental form</h4> 
 
\t \t \t </div> 
 
\t \t \t <div class="modal-body"> 
 
\t \t \t \t 
 
\t \t \t \t <div class="form-group"> 
 
\t \t \t \t \t <label for="title" class="col-sm-2 control-label">Title</label> 
 
\t \t \t \t \t <div class="col-sm-10"> 
 
\t \t \t \t \t <input type="text" name="title" class="form-control" id="title" placeholder="Title"> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="form-group"> 
 
\t \t \t \t \t <label for="color" class="col-sm-2 control-label">Color</label> 
 
\t \t \t \t \t <div class="col-sm-10"> 
 
\t \t \t \t \t <select name="color" class="form-control" id="color"> 
 
\t \t \t \t \t \t <option value="">Choose</option> 
 
\t \t \t \t \t \t <option style="color:#0071c5;" value="#0071c5">&#9724; Dark blue</option> 
 
\t \t \t \t \t \t <option style="color:#40E0D0;" value="#40E0D0">&#9724; Turquoise</option> 
 
\t \t \t \t \t \t <option style="color:#008000;" value="#008000">&#9724; Green</option> \t \t \t \t \t \t 
 
\t \t \t \t \t \t <option style="color:#FFD700;" value="#FFD700">&#9724; Yellow</option> 
 
\t \t \t \t \t \t <option style="color:#FF8C00;" value="#FF8C00">&#9724; Orange</option> 
 
\t \t \t \t \t \t <option style="color:#FF0000;" value="#FF0000">&#9724; Red</option> 
 
\t \t \t \t \t \t <option style="color:#000;" value="#000">&#9724; Black</option> 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t \t </select> 
 
\t \t \t \t \t \t 
 

 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="form-group"> 
 
\t \t \t \t \t <label for="start" class="col-sm-2 control-label">Start date</label> 
 
\t \t \t \t \t <div class="col-sm-10"> 
 
\t \t \t \t \t <input type="text" name="start" class="form-control" id="start" > 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="form-group"> 
 
\t \t \t \t \t <label for="end" class="col-sm-2 control-label">End date</label> 
 
\t \t \t \t \t <div class="col-sm-10"> 
 
\t \t \t \t \t <input type="text" name="end" class="form-control" id="end" > 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t \t 
 
\t \t \t </div> 
 
\t \t \t <div class="modal-footer"> 
 
\t \t \t \t <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
\t \t \t \t <button type="submit" class="btn btn-primary">Save changes</button> 
 
\t \t \t </div> 
 
\t \t \t </form> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t \t </div> 
 
\t \t 
 
\t \t 
 
\t \t 
 
\t \t <!-- Modal --> 
 
\t \t <div class="modal fade" id="ModalEdit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
 
\t \t <div class="modal-dialog" role="document"> 
 
\t \t \t <div class="modal-content"> 
 
\t \t \t <form class="form-horizontal" method="POST" action="editEventTitle.php"> 
 
\t \t \t <div class="modal-header"> 
 
\t \t \t \t <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
 
\t \t \t \t <h4 class="modal-title" id="myModalLabel">Edit Event</h4> 
 
\t \t \t </div> 
 
\t \t \t <div class="modal-body"> 
 
\t \t \t \t 
 
\t \t \t \t <div class="form-group"> 
 
\t \t \t \t \t <label for="title" class="col-sm-2 control-label">Title</label> 
 
\t \t \t \t \t <div class="col-sm-10"> 
 
\t \t \t \t \t <input type="text" name="title" class="form-control" id="title" placeholder="Title"> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="form-group"> 
 
\t \t \t \t \t <label for="color" class="col-sm-2 control-label">Color</label> 
 
\t \t \t \t \t <div class="col-sm-10"> 
 
\t \t \t \t \t <select name="color" class="form-control" id="color"> 
 
\t \t \t \t \t \t <option value="">Choose</option> 
 
\t \t \t \t \t \t <option style="color:#0071c5;" value="#0071c5">&#9724; Dark blue</option> 
 
\t \t \t \t \t \t <option style="color:#40E0D0;" value="#40E0D0">&#9724; Turquoise</option> 
 
\t \t \t \t \t \t <option style="color:#008000;" value="#008000">&#9724; Green</option> \t \t \t \t \t \t 
 
\t \t \t \t \t \t <option style="color:#FFD700;" value="#FFD700">&#9724; Yellow</option> 
 
\t \t \t \t \t \t <option style="color:#FF8C00;" value="#FF8C00">&#9724; Orange</option> 
 
\t \t \t \t \t \t <option style="color:#FF0000;" value="#FF0000">&#9724; Red</option> 
 
\t \t \t \t \t \t <option style="color:#000;" value="#000">&#9724; Black</option> 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t \t </select> 
 
\t \t \t \t \t </div>

來源

2017-05-28 wiwi

據我瞭解，你要檢查所選日期的可用性！按照這一點，你需要四種操作：

創建一個PHP函數，查詢這些日期隨時隨地可以爲他們節省
獲取輸入所選擇的日期（你可以使用jQuery或JavaScript爲）
製作POST Ajax請求，您可以在其中調用您的PHP函數
返回用戶響應！

這就是你走過去實現你想要的。

TIPS： 1.

$(document).ready(function({ 
    $('#start').on('change', function({ 
     var your_start_date_value = $('#start').val(); 
    }); 
});

更上讀出的文檔：http://api.jquery.com/val/

初始化AJAX請求，可以使用：Ajax的或$ .POST（其letarally是Ajax請求）

$.post("phpfunction/url", { date: "your_start_date_value"} ,function(response) { 
    $(".result").html(response); // display results 
});

對於阿賈克斯請求，請閱讀更多：http://api.jquery.com/jquery.ajax/

如果您有任何問題，請回復我的評論！

來源

2017-05-31 13:03:11

需要你的幫助，以檢查此代碼..（$（文件）。就緒（函數（）{ \t \t \t \t $（ '的startDate'）。在（ '變'，函數（{ \t \t \t變種的startDate = $（ '的startDate'）VAL（）; \t \t}）; \t \t \t}）; \t \t $（ '＃日曆'）fullCalendar（{ \t \t \t頭：{ \t \t \t \t左：「上一個，下一個今天， \t \t \t \t中心： '標題'， \t \t \t \t權： '一個月，agendaWeek，agendaDay' \t \t \t}） – wiwi

創建日曆可用性按鈕

回答

相關問題