bootstrap-datepicker日历控件的使用心得

1.导入文件

bootstrap-datepicker/dist/css/bootstrap-datepicker3.css

bootstrap-datepicker/dist/css/bootstrap-datepicker3.css

bootstrap-datepicker/dist/js/bootstrap-datepicker.js

bootstrap-datepicker/js/locales/bootstrap-datepicker.zh-CN.js

2.css+jss

<link rel="stylesheet" href="/static/ace/components/bootstrap-datepicker/dist/css/bootstrap-datepicker3.css" />

<link rel="stylesheet" href="/static/ace/components/bootstrap-datepicker/dist/css/bootstrap-datepicker3.css" />

<script src="/static/ace/components/bootstrap-datepicker/dist/js/bootstrap-datepicker.js"></script>
<script src="/static/ace/components/bootstrap-datepicker/js/locales/bootstrap-datepicker.zh-CN.js" type="text/javascript"></script>

jsp：

到账起始日期:
<input id="startdate" type="text"  class="Wdate" onFocus="WdatePicker({minDate:'#F{$dp.$D(\'enddate\',{M:-3})}',maxDate:'#F{$dp.$D(\'enddate\')}'})"/>

到账结束日期:

<input id="enddate" type="text"   class="Wdate" onFocus="WdatePicker({maxDate:'#F{$dp.$D(\'startdate\',{M:3})}',minDate:'#F{$dp.$D(\'startdate\')}'})"/>

效果：两个日期前后不超过三个月

<input id="form-field-date" readonly class="form_datetime">

$("#form-field-date").datepicker({ language: "zh-CN", autoclose: true,//选中之后自动隐藏日期选择框 clearBtn: true,//清除按钮 todayBtn: true,//今日按钮 language:'zh-CN', format: "yyyy-mm-dd"//日期格式，详见 http://bootstrap-datepicker.readthedocs.org/en/release/options.html#format});