layui時間控件,獲取頁面選中的時間值。
阿新 • • 發佈:2019-03-05
date view pre com stitching earch 時間控件 cal active
先貼上html文檔
<div class=‘layui-form‘> <div class="layui-form-item"> <div class="layui-inline"> <label class="layui-form-label">起始日期:</label> <input type="text" class="layui-input" id="startdatepicker" autocomplete="off" /> </div> <div class="layui-inline"> <label class="layui-form-label">截止日期:</label> <input type="text" class="layui-input" id="enddatepicker" autocomplete="off" /> </div> <button class="layui-btn" data-type="reload">搜索</button> </div> </div>
時間選擇器
1 layui.use(‘laydate‘,function(){ 2 var laydate = layui.laydate; 3 4 laydate.render({ 5 elem:‘#startdatepicker‘ 6 ,format:‘yyyy-MM-dd‘ 7 ,done:function(value,date,startDate){ 8 //$scope.querySearchParams.startdatepicker = stitchingDate(value,‘startdatepicker‘);View Code9 } 10 }); 11 12 var enddatepicker=laydate.render({ 13 elem:‘#enddatepicker‘ 14 ,format:‘yyyy-MM-dd‘ 15 ,done:function(value,date,startDate){ 16 //$scope.querySearchParams.startdatepicker = stitchingDate(value,‘startdatepicker‘); 17 }18 }); 19 });
獲取日期,並重載
1 1 var $ = layui.$, active = { 2 2 reload : function() { 3 3 var startdate = $("#startdatepicker"); 4 4 var enddate = $("#enddatepicker"); 5 5 6 6 //執行重載 7 7 table.reload(‘tests‘, { 8 8 where : { 9 9 start : startdate.val(), 10 10 end : enddate.val() 11 11 } 12 12 }); 13 13 } 14 14 }; 15 15 $(‘.layui-btn‘).on(‘click‘, function() { 16 16 var type = $(this).data(‘type‘); 17 17 active[type] ? active[type].call(this) : ‘‘; 18 18 });View Code
layui時間控件,獲取頁面選中的時間值。