[英]Bootstrap Datepicker load max and min date using Ajax
我想通過ajax調用加載引導日期選擇器的最小日期和最大日期
Bootstrap DatePicker配置:
$(document).ready(function() {
$('#datepicker').datepicker({
format: 'yyyy-mm-dd',
autoclose: true,
keyboardNavigation: true,
todayHighlight: true,
minDate: sdate,
maxDate: edate
})
.on('changeDate', function() {
getMessageDate();
});
});
Ajax在配置中加載最小和最大日期
var sdate;
var edate;
$(document).ready(function() {
(function () {
var result;
$.ajax({
url: '${pageContext.request.contextPath}/IRSGetDate',
async: false,
method: 'POST',
success: function(data) {
result = data;
},
complete: function(){
var obj = $.parseJSON(result);
sdate = obj['start'];
edate = obj['end'];
},
error: function(error,text,http){
alert(error + " " + text + " " + http);
}
});
})();
});
但是仍然無法正常工作,我做錯了嗎?
還可以添加僅在選擇器中啟用的特定日期嗎?
試試這個代碼
您的代碼中做了一些更正
$(document).ready(function() {
(function () {
var result;
$.ajax({
url: 'https://api.myjson.com/bins/doxkl',
async: false,
method: 'GET',
success: function(data) {
result = data;
},
complete: function(){
sdate = result[0].start;
edate = result[0].end;
loadDatepicker(sdate,edate);
},
error: function(error,text,http){
alert(error + " " + text + " " + http);
}
});
function loadDatepicker(sdate,edate){
$('#datepicker').datepicker({
format: 'mm/dd/yyyy',
autoclose: true,
keyboardNavigation : true ,
todayHighlight:true,
autoclose: true,
startDate:sdate,
endDate:edate
})
.on('changeDate', function() {
getMessageDate();
});
}
})();
});
在下面的示例中,我設置了"start": "08/08/2017"
和"end": "08/28/2017"
$(document).ready(function() { (function () { var result; $.ajax({ url: 'https://api.myjson.com/bins/doxkl', async: false, method: 'GET', success: function(data) { result = data; }, complete: function(){ sdate = result[0].start; edate = result[0].end; loadDatepicker(sdate,edate); }, error: function(error,text,http){ alert(error + " " + text + " " + http); } }); function loadDatepicker(sdate,edate){ $('#datepicker').datepicker({ format: 'mm/dd/yyyy', autoclose: true, keyboardNavigation : true , todayHighlight:true, autoclose: true, startDate:sdate, endDate:edate }) .on('changeDate', function() { getMessageDate(); }); } })(); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/js/bootstrap-datepicker.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.0/css/bootstrap-datepicker.css"> <input type="text" type="text" id="datepicker" />
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.