我修复它时遇到很多错误,但问题是,当我点击日期选择器时,为什么不弹出?这是我唯一的问题,哪个div目标?
<?php
require '../common/pdo_connect.php';
try{
$stmt = $db->query("SELECT date FROM disabledate");
$db_ddates = $stmt->fetchAll(\PDO::FETCH_ASSOC);
$js_ddates = "";
foreach ($db_ddates as $row => $record) {
$js_ddates .= '"' . $record['date'] . '",';
}
}
catch(\PDOException $e) {
echo $e->getMessage();
}
?>
<label>Pick a date
<input
id="drop3"
class="datepicker"
name="drop3"
type="text"
value=""
data-value="">
</label>
<div id="container"></div>
<script src="datepicker/tests/jquery.1.9.1.js"></script>
<script src="datepicker/lib/picker.js"></script>
<script src="datepicker/lib/picker.date.js"></script>
<script src="datepicker/lib/legacy.js"></script>
<script type="text/javascript">
//datepicker
// take dates as array of strings from db
var ddates_str_arr = [ <?php echo $js_ddates; ?> ];
// build dates array for picker
var disdates = [];
for (var i = 0; i < ddates_str_arr.length; i++) {
disdates.push(new Date(ddates_str_arr[i]));
}
var $input = $( '.datepicker' ).pickadate({
formatSubmit: 'yyyy/mm/dd',
min: true,
container: '#container',
// editable: true,
closeOnSelect: true,
closeOnClear: false,
disable: disdates
});
var picker = $input.pickadate('picker')
</script>
<script src="jquery-1.9.0.min.js"></script>
<script>
$(document).ready(function(){
$("div#container").change(function(){
var products_id = $("input#drop3").attr('value');
if (products_id.length > 0 ) {
$.ajax({
type: "POST",
url: "fetch_employees.php",
data: "products_id="+products_id,
cache: false,
beforeSend: function () {
$('#employees').html('<img src="loader.gif" alt="" width="24" height="24">');
},
success: function(html) {
$("#employees").html( html );
}
});
} else {
$("#employees").html( "" );
}
});
});
</script>
答案 0 :(得分:1)
尝试使用json将数据从db传递给datepiker:
<?php
require '../common/pdo_connect.php';
try{
$stmt = $db->query("SELECT date FROM disabledate");
$db_ddates = $stmt->fetchAll(\PDO::FETCH_ASSOC);
$js_ddates = json_encode([dates=>$db_ddates]);
}
catch(\PDOException $e) {
echo $e->getMessage();
}
?>
<label>Pick a date
<input
id="drop3"
class="datepicker"
name="drop3"
type="text"
value=""
data-value="">
</label>
<div id="container"></div>
<script src="datepicker/tests/jquery.1.9.1.js"></script>
<script src="datepicker/lib/picker.js"></script>
<script src="datepicker/lib/picker.date.js"></script>
<script src="datepicker/lib/legacy.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//datepicker
// take dates as array of strings from db
var ddates_str_arr = JSON.parse('<?php echo $js_ddates; ?>');
// build dates array for picker
var disdates = [];
$.each(ddates_str_arr.dates,function(i,v) {
disdates.push(new Date(v));
})
var $input = $( '.datepicker' ).pickadate({
formatSubmit: 'yyyy/mm/dd',
min: true,
container: '#container',
// editable: true,
closeOnSelect: true,
closeOnClear: false,
disable: disdates
});
var picker = $input.pickadate('picker')
$("div#container").change(function(){
var products_id = $("input#drop3").attr('value');
if (products_id.length > 0 ) {
$.ajax({
type: "POST",
url: "fetch_employees.php",
data: "products_id="+products_id,
cache: false,
beforeSend: function () {
$('#employees').html('<img src="loader.gif" alt="" width="24" height="24">');
},
success: function(html) {
$("#employees").html( html );
}
});
} else {
$("#employees").html( "" );
}
});
});
</script>