|
|
<div class="input-group input-group-lg append_test" >
|
<span style="width: 50px;" class="fa fa-globe input-group-addon dropdown-toggle" data-toggle="dropdown" ><span> </span><span id="current">小时:</span></span>
|
<input type='text' class="form-control date" id='appDate' name="appDate"/>
|
<ul class="dropdown-menu">
|
|
<div class="layui-form">
|
<div class="layui-form-item">
|
<div class="layui-inline">
|
<div class="layui-input-inline">
|
<input type="radio" name="datatype" value="hour" title="小时数据" checked>
|
<input type="text" class="layui-input" id="datatype_hour" placeholder="yyyy-MM-dd HH">
|
</div>
|
</div>
|
<div class="layui-inline">
|
<div class="layui-input-inline">
|
<input type="radio" name="datatype" value="day" title="天数据" >
|
<input type="text" class="layui-input" id="datatype_day" placeholder="yyyy-MM-dd">
|
</div>
|
</div>
|
</div>
|
</div>
|
|
</ul>
|
</div>
|
|
|
|
<!-- <div class="btn-group append_test">
|
|
<button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
|
|
<!-- <span class="fa fa-globe" id="current"> 小时: -->
|
<input type='button' class="form-control" id='' name="" value="" />
|
|
</button>
|
<button type="button" class="btn btn-primary">
|
<!-- <input type="text" class="layui-input" id="appDate" placeholder="yyyy-MM-dd"> -->
|
<!-- <input type='text' class="form-control date" id='appDate' name="appDate"/> -->
|
</button>
|
|
|
</div> -->
|
|
<script>
|
$(document).ready(function() {
|
initDayHour();
|
|
|
//console.log("i am jquery");
|
//var currentHour = getDefaultDateTime();
|
//$('#currentHour').text(currentHour);
|
|
|
$('input[type=radio][name=datatype]').change(function() {
|
if (this.value == 'hour') {
|
//alert("Allot Thai Gayo Bhai");
|
$('#current').text("小时:");
|
initDayHour();
|
}
|
else if (this.value == 'day') {
|
//alert("Transfer Thai Gayo");
|
$('#current').text("天:");
|
initDay();
|
}
|
reloadTop10();
|
});
|
|
|
|
|
|
})
|
|
function initDayHour(){
|
try {
|
$("#appDate").datetimepicker('remove');
|
} catch (error) {
|
|
}
|
|
$("#appDate").datetimepicker({
|
bootcssVer:3, //bootstrap-datetimepicker+bootstrap v3,但这个插件使用的时候,并没有和V3相匹配,仍然调用的是bootstrap V2的图标 把bootcssVer的值直接设为3,否则datetimepicker不会显示出上、下个月的箭头
|
format: 'yyyy-mm-dd HH:00:00',
|
minView: 'day',//设置时间选择为年月日 去掉时分秒选择
|
todayBtn: true, //如果此值为true 或 "linked",则在日期时间选择器组件的底部显示一个 "Today" 按钮用以选择当前日期。如果是true的话,"Today" 按钮仅仅将视图转到当天的日期,如果是"linked",当天日期将会被选中。
|
clearBtn:true,
|
language: 'zh-CN',
|
autoclose: true, //当选择一个日期之后是否立即关闭此日期时间选择器。
|
keyboardNavigation: true, //是否允许通过方向键改变日期。
|
forceParse: true, //当选择器关闭的时候,是否强制解析输入框中的值。
|
initialDate:new Date(),
|
todayHighlight: 1 //如果为true, 高亮当前日期
|
}).on("changeDate", function () {
|
//設置可选的最后日期為當前日期
|
//$("#start_time").datetimepicker("setEndDate", getToday())
|
reloadTop10();
|
});
|
|
$("#appDate").datetimepicker("setDate", new Date());
|
}
|
|
function initDay(){
|
try {
|
$("#appDate").datetimepicker('remove');
|
} catch (error) {
|
|
}
|
$("#appDate").datetimepicker({
|
bootcssVer:3, //bootstrap-datetimepicker+bootstrap v3,但这个插件使用的时候,并没有和V3相匹配,仍然调用的是bootstrap V2的图标 把bootcssVer的值直接设为3,否则datetimepicker不会显示出上、下个月的箭头
|
format: 'yyyy-mm-dd',
|
minView: 'month',//设置时间选择为年月日 去掉时分秒选择
|
todayBtn: true, //如果此值为true 或 "linked",则在日期时间选择器组件的底部显示一个 "Today" 按钮用以选择当前日期。如果是true的话,"Today" 按钮仅仅将视图转到当天的日期,如果是"linked",当天日期将会被选中。
|
clearBtn:true,
|
language: 'zh-CN',
|
autoclose: true, //当选择一个日期之后是否立即关闭此日期时间选择器。
|
keyboardNavigation: true, //是否允许通过方向键改变日期。
|
forceParse: true, //当选择器关闭的时候,是否强制解析输入框中的值。
|
initialDate:new Date(),
|
todayHighlight: 1 //如果为true, 高亮当前日期
|
}).on("changeDate", function () {
|
//設置可选的最后日期為當前日期
|
//$("#start_time").datetimepicker("setEndDate", getToday())
|
reloadTop10();
|
});
|
|
$("#appDate").datetimepicker("setDate", new Date());
|
|
}
|
|
function applyDateType(){
|
var dateType = $('input[type=radio][name=datatype]').val();
|
return dateType;
|
}
|
|
function reloadTop10(){
|
var leftAndRight = mars3d.widget.getClass("widgetsTS/widget_Overall/widget.js");
|
if(leftAndRight){
|
if(leftAndRight.viewWindowLeft){
|
leftAndRight.viewWindowLeft.loadTop10();
|
}
|
}
|
}
|
|
function getAppDateTime(){
|
return $('#appDate').val();
|
}
|
</script>
|