[Solved] Populate select dropdown with correct number of days when select month. - wolfgang1983 - 12-21-2015
Currently on my modal form. I have 2 select drop down's.
Called year, month.
At the moment for the day I have to type it in.
What I would like to know is how am so that when I select a month it will populate the select day div with the correct number of days because some months shorter than others?
PHP Code: <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <?php echo form_open('dashboard/calendar');?> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="myModalLabel">Add Calendar Event</h4> </div> <div class="modal-body">
<div class="form-group"> <select name="year" class="form-control"> <?php $cur_year = date('Y'); for($year = ($cur_year-10); $year <= ($cur_year+10); $year++) { if ($year == $cur_year) { echo '<option value="'.$year.'" selected="selected">'.$year.'</option>'; } else { echo '<option value="'.$year.'">'.$year.'</option>'; } } ?> <select> </div> <div class="form-group"> <select name="month" class="form-control"> <?php
$monthName = array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December');
for ($i=0; $i < count($monthName); $i++) {
$mn = 1 + $i;
if($mn == date('m')) {
echo '<option selected value=' . $mn . '>' . $monthName[$i] . '</option>';
} else { echo '<option value=' . $mn . '>' . $monthName[$i] . '</option>';
}
}
?>
</select> </div>
<!--
I currently have to enter day in mannually
<div class="form-group"> <select name="day" class="form-control"></select> </div>
-->
<div class="form-group"> <input type="text" name="day" class="form-control" placeholder="Enter Day" value="" /> </div>
<div class="form-group"> <textarea name="event" rows="5" class="form-control"></textarea> </div>
</div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <input type="submit" name="save" class="btn btn-primary" value="Save" /> </div> </div> <?php echo form_close();?> </div> </div>
RE: Populate select dropdown with correct number of days when select month. - pdthinh - 12-21-2015
(12-21-2015, 01:52 AM)wolfgang1983 Wrote: What I would like to know is how am so that when I select a month it will populate the select day div with the correct number of days because some months shorter than others?
You could check this:
Code: month = 1, 3, 5, 7, 8, 10, 12 => 31 days
month = 4, 6, 9, 11 => 30 days
month = 2 => if this year is leaf year => 29 days else 28 days
RE: Populate select dropdown with correct number of days when select month. - Happy Camper - 12-21-2015
why not use a date picker? (obviously depends on what you are trying to do)
https://jqueryui.com/datepicker/
If you still need a select with the number of days in the month use
http://php.net/manual/en/function.cal-days-in-month.php
you would need to invoke some sort of a function via ajax each time either the year or month select is changed
RE: Populate select dropdown with correct number of days when select month. - sintakonte - 12-21-2015
you should do this via javascript - it doesn't have much to do with CI, i think
if you use jquery you can try something like this (untested just wrote it down)
Code: $('select[name="month"]').on("change", function()
{
var year = $('select[name="year"]').val();
if (year > 0)
{
$('select[name="day"]).find("option").remove();
var daysInMonth = new Date(year, $(this).val(), 0).getDate();
for(var i=1; i<=daysInMonth;i++)
{
$('select[name="day"]).append($("<option></option>").attr("value",i).text(i);
}
}
});
RE: Populate select dropdown with correct number of days when select month. - wolfgang1983 - 12-21-2015
(12-21-2015, 04:26 AM)Happy Camper Wrote: why not use a date picker? (obviously depends on what you are trying to do)
https://jqueryui.com/datepicker/
If you still need a select with the number of days in the month use
http://php.net/manual/en/function.cal-days-in-month.php
you would need to invoke some sort of a function via ajax each time either the year or month select is changed
Date picker Not what I am after.
RE: Populate select dropdown with correct number of days when select month. - wolfgang1983 - 12-21-2015
(12-21-2015, 04:31 AM)sintakonte Wrote: you should do this via javascript - it doesn't have much to do with CI, i think
if you use jquery you can try something like this (untested just wrote it down)
Code: $('select[name="month"]').on("change", function()
{
var year = $('select[name="year"]').val();
if (year > 0)
{
$('select[name="day"]).find("option").remove();
var daysInMonth = new Date(year, $(this).val(), 0).getDate();
for(var i=1; i<=daysInMonth;i++)
{
$('select[name="day"]).append($("<option></option>").attr("value",i).text(i);
}
}
});
Not work did not display any days.
RE: Populate select dropdown with correct number of days when select month. - sintakonte - 12-21-2015
no offense but you should've found the typos in the script by yourself
Code: $('select[name="month"]').on("change", function()
{
var year = $('select[name="year"]').val();
if (year > 0)
{
$('select[name="day"]').find("option").remove();
var daysInMonth = new Date(year, $(this).val(), 0).getDate();
for(var i=1; i<=daysInMonth;i++)
{
console.log(i);
$('select[name="day"]').append($("<option></option>").attr("value",i).text(i));
}
}
});
RE: Populate select dropdown with correct number of days when select month. - wolfgang1983 - 12-21-2015
(12-21-2015, 04:58 AM)sintakonte Wrote: no offense but you should've found the typos in the script by yourself
Code: $('select[name="month"]').on("change", function()
{
var year = $('select[name="year"]').val();
if (year > 0)
{
$('select[name="day"]').find("option").remove();
var daysInMonth = new Date(year, $(this).val(), 0).getDate();
for(var i=1; i<=daysInMonth;i++)
{
console.log(i);
$('select[name="day"]').append($("<option></option>").attr("value",i).text(i));
}
}
});
I did and still did not work.
RE: Populate select dropdown with correct number of days when select month. - wolfgang1983 - 12-21-2015
(12-21-2015, 04:58 AM)sintakonte Wrote: no offense but you should've found the typos in the script by yourself
Code: $('select[name="month"]').on("change", function()
{
var year = $('select[name="year"]').val();
if (year > 0)
{
$('select[name="day"]').find("option").remove();
var daysInMonth = new Date(year, $(this).val(), 0).getDate();
for(var i=1; i<=daysInMonth;i++)
{
console.log(i);
$('select[name="day"]').append($("<option></option>").attr("value",i).text(i));
}
}
});
Thank you for help I have had to add
Code: $( document ).ready(function() {
});
And it worked.
|