0

我正在使用T00rk 的引导材料日历选择器和 FezVrasta引导材料设计。我正在尝试扩展其功能,例如添加月份和年份的下拉选项(成功集成到日历中)但是我无法将更改绑定到月份和年份(当您从下拉选项中选择月份和年份时) . 是的,当您从下拉列表中选择时,月份和年份的文本会发生变化,但这些变化不会反映当前的活动日期输入,请提供任何想法、帮助和线索?

注意:这是修改后的日历选择器 js

$(document).ready(function() {
  $(".thehide").hide();
  //initialize the material design
  $.material.init();
  $.material.ripples();
  $('.datepicker').bootstrapMaterialDatePicker({
    weekStart: 0,
    time: false,
    format: 'MMMM DD, YYYY'
  });
});
.padding_15px {
  padding: 15px;
}
.shadow-z-1 {
  box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.12), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
}
.d_dp {
  position: absolute;
  z-index: 999999999;
}
.d_dp,
.d_dp {
  list-style: none;
}
.d_dp a {
  display: block;
  padding: 4px 0px;
  font-size: 13px;
  color: #555555;
  text-decoration: none;
}
.bg_white {
  background-color: #ffffff;
}
.radius_3px {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.thehide {
  display: none;
}
<!-- jquery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- bootstrap 3 -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<!-- material design for bootstrap -->
<link type="text/css" rel="stylesheet" href="http://fezvrasta.github.io/bootstrap-material-design/dist/css/bootstrap-material-design.css">
<link type="text/css" rel="stylesheet" href="http://fezvrasta.github.io/bootstrap-material-design/dist/css/ripples.min.css">
<!-- google icons and roboto -->
<link href='http://fonts.googleapis.com/css?family=Roboto:400,500' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- momentjs -->
<script type="text/javascript" src="http://momentjs.com/downloads/moment-with-locales.min.js"></script>
<!-- material design scripts -->
<script type="text/javascript" src="http://fezvrasta.github.io/bootstrap-material-design/dist/js/material.js"></script>
<script type="text/javascript" src="http://fezvrasta.github.io/bootstrap-material-design/dist/js/ripples.min.js"></script>
<!-- material datepicker -->
<link rel="stylesheet" type="text/css" href="http://t00rk.github.io/bootstrap-material-datetimepicker/css/bootstrap-material-datetimepicker.css">
<!-- datepicker script -->
<script type="text/javascript" src="https://microfinanceconsult.com/datepicker.js"></script>

<input type="text" class="datepicker form-control" placeholder="Click to select time...">

4

0 回答 0