1
I need the datapicker to load specific dates dynamically, which are saved in the database, I was able to get it to load manually, but there are several dates and may vary as the user saves in the database.
I am using the following code, which displays manually selected dates with a specific color:
<script>
var active_dates = ["2-9-2019","22-9-2019"];
$('.datepicker').datepicker({
autoclose: true,
format: "dd-mm-yyyy",
beforeShowDay: function(date){
var d = date;
var curr_date = d.getDate();
var curr_month = d.getMonth() + 1;
var curr_year = d.getFullYear();
var formattedDate = curr_date + "-" + curr_month + "-" + curr_year
if ($.inArray(formattedDate, active_dates) != -1){
return {
classes: 'activeClass'
};
}
return;
}
});
$(".datepicker").attr("autocomplete", "off");
</script>
CSS:
.activeClass{
color: #ecf0f1;
background: #2980b9;
}
Upshot:
After some researches and studies I saw that it is possible to pass data from a php variable to javascript. Exemplifying:
<?php
$color = "Red";
?>
In javascript:
var color = "<?php echo $color; ?>";
I’m trying this way, but without success!:
<?php
$diasValidos = $this->db->get_where('school_days')->result_array();
?>
In the Datapicker:
<script>
var active_dates = <?php $diasValidos ?>;
$('.datepicker').datepicker({
autoclose: true,
format: "dd-mm-yyyy",
beforeShowDay: function(date){
var d = date;
var curr_date = d.getDate();
var curr_month = d.getMonth() + 1;
var curr_year = d.getFullYear();
var formattedDate = curr_date + "-" + curr_month + "-" + curr_year
if ($.inArray(formattedDate, active_dates) != -1){
return {
classes: 'activeClass'
};
}
return;
}
});
$(".datepicker").attr("autocomplete", "off");
</script>
Table print in database:
Have you tried:
var active_dates = [<?php echo implode("','",$diasValidos) ?>];
– Sam
Peter, give a var_dump($this->db->get_where('school_days')->result_array()); and put the result, please. We need to watch what you have on this return
– user148170
array(4) { ["id"]=> string(1) "5" ["day"]=> string(2) "21" ["Month"]=> string(1) "1" ["year"]=> string(4) "2019" }, it’s like this! I’ll take a print of the comic book and post the question.
– Pedro Paulo