bootstrap-datepicker选择日期和时间

顾宏朗
2023-12-01
<link rel="stylesheet" href="${base}/assets/css/bootstrap-datetimepicker.css" />
<div class="form-group">
   <label>开始时间</label>
   <!--指定 date标记-->
   <div class='input-group date' id='datetimepicker1'>
      <input placeholder="请选择开始时间" id="startTime" name="startTime"  type='text' class="form-control" />
      <span class="input-group-addon">
                      <span class="glyphicon glyphicon-calendar"></span>
                  </span>
   </div>
</div>
<div class="form-group">
   <label>结束时间</label>
   <!--指定 date标记-->
   <div class='input-group date' id='datetimepicker2'>
      <input placeholder="请选择结束时间" id="endTime" name="endTime"  type='text' class="form-control" />
      <span class="input-group-addon">
                      <span class="glyphicon glyphicon-calendar"></span>
                  </span>
   </div>
</div>
<script src="${base}/assets/js/date-time/moment.min.js" type="text/javascript"></script>
<script src="${base}/assets/js/date-time/locales/moment.zh-CN.js" type="text/javascript"></script>
<script src="${base}/assets/js/date-time/bootstrap-datetimepicker.min.js" type="text/javascript"></script>
startTime:$("#startTime").val(),
endTime:$("#endTime").val(),
<#--搜索-->
$("#btnSearch").click(function(){
 $jqGrid.setGridParam({page:1,postData{startTime:$("#startTime").val(),endTime:$("#endTime").val(),property:$("#property").val(),keyword:$("#keyword").val()}}).trigger("reloadGrid");
});
$(function () {
   $('#datetimepicker1').datetimepicker({
      format: 'YYYY-MM-DD HH:mm:ss',
      locale: moment.locale('zh-cn')
   });
   $('#datetimepicker2').datetimepicker({
      format: 'YYYY-MM-DD HH:mm:ss',
      locale: moment.locale('zh-cn')
   });
});

//后台获取选中的日期和时间

String startTime = request.getParameter("startTime");
String endTime = request.getParameter("endTime");
 类似资料: