• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
[Solved] Populate select dropdown with correct number of days when select month.

#1
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">&times;</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 $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> 


Attached Files
.php   modal.php (Size: 2.45 KB / Downloads: 224)
There's only one rule - please don't tell anyone to go and read the manual.  Sometimes the manual just SUCKS!
Reply

#2
(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
Reply

#3
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
Reply

#4
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);
        }

    }
});
Reply

#5
(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.
There's only one rule - please don't tell anyone to go and read the manual.  Sometimes the manual just SUCKS!
Reply

#6
(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.
There's only one rule - please don't tell anyone to go and read the manual.  Sometimes the manual just SUCKS!
Reply

#7
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));
        }

    }
});
Reply

#8
(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.
There's only one rule - please don't tell anyone to go and read the manual.  Sometimes the manual just SUCKS!
Reply

#9
(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.
There's only one rule - please don't tell anyone to go and read the manual.  Sometimes the manual just SUCKS!
Reply


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2019 MyBB Group.