I am facing a problem where my bootstrap datetimepicker cannot work properly when the datetimepicker is shown on the upper side.

Here is a screenshot:

I cannot click anything on the datetimepicker when the datetimepicker shown on the upper side

When the datetimepicker is shown on the lowers side, I can click and select the datetimepicker and it will work properly.

This is my code:

<script type="text/javascript">

$(function() {
$('#select_year').datepicker({
 format: "yyyy", // Notice the Extra space at the beginning
viewMode: "years", 
minViewMode: "years",
 autoclose: true
});
});
</script>

This is how I display the row:

        <form action="set_holidays.php" method="post" >
    <div class="col-sm-3">
        <label for="field-1"  class="control-label pull-left holiday-vertical"><h4 style='padding-left:10px;'><b>Year</b></h4></label>  
        <div class="col-sm-8"> 
            <div class="input-group date">           
            <input type="text" id="select_year" name="year" class="form-control years" value="$this->year">
              <span class="input-group-btn">
                        <button class="btn btn-default" type="submit">Go</button>
                        <input type='hidden' value='refresh' name='action'>
                    </span>
            </div>
        </div>                        
             </div>                                    
    </form>

This is how i included js and css

<link type="text/css" href="mypath/bootstrap.min.css" rel="stylesheet"/>
<link type="text/css" href="mypath/bootstrap-datetimepicker.min.css" rel="stylesheet"/>
<link type="text/css" href="mypath/datepicker.css" rel="stylesheet"/>

<script type="text/javascript" src="mypath/jquery.min.js"></script>
<script type="text/javascript" src="mypath/bootstrap.min.js"></script>
<script type="text/javascript" src="mypath/bootstrap-datepicker.js"></script>

My97DatePicker 为什么没有效果

talisa95

1个回复