当前位置: 代码迷 >> 综合 >> easyui-datebox
  详细解决方案

easyui-datebox

热度:26   发布时间:2023-12-17 11:39:58.0

<td>日期:&nbsp;
    <input id="td" class="easyui-datebox" editable="false" name="dateDn" value="" panelHeight="auto" style="width: 100px;" /> &nbsp; ——— &nbsp;
    <input id="tu" class="easyui-datebox" editable="false" name="dateUp" value="" panelHeight="auto" style="width: 100px;" /> &nbsp;    
</td>
<td id="dateError" style="color:red;display:none" >结束时间必须大于起始时间</td>

1.
设置属性:
$(".datebox :text").attr("readonly","readonly");
赋值:
function getCurentDateStr()  
{   
        var now = new Date();  
        var year = now.getFullYear();       //年  
        var month = now.getMonth() + 1;     //月  
        var day = now.getDate()+1;            //日  
        var clock = year + "-";  
        if(month < 10) clock += "0";         
        clock += month + "-";  
        if(day < 10) clock += "0";   
        clock += day;  
        return clock;   
}
$('#td').datebox('setValue', getCurentDateStr());
取值:
var v = $("#td").datebox("getValue");
清空:
 $('#td').textbox('setValue',"");

 2. 时间展示格式
 页面上传递的时间为string类型,数据库中一般为date。
 从页面传递到后台时,应将实体对应字段改为string类型。
 从后台传递到页面时:
 方法一:javabean中加注解
 @JsonFormat(pattern="yyyy-MM-dd HH:mm:ss",timezone = "GMT+8")
 private Date addTime;

 <th data-options="field:'addTime',width:120,align:'left'">创建时间</th>   

 方法二:
 function getFormatTime(value){
        var stamp = new Date(value);  
        return stamp.toLocaleString();
    }
 <th field="addTime" formatter="getFormatTime" width="80"> 创建时间</th>

3.设置起始截止日期:起始日期默认明天;截止日期大于起始日期
function getCurentDateStr()  
{   
    var now = new Date();  
    var year = now.getFullYear();       //年  
    var month = now.getMonth() + 1;     //月  
    var day = now.getDate()+1;            //日  
    var clock = year + "-";  
    if(month < 10) clock += "0";         
    clock += month + "-";  
    if(day < 10) clock += "0";   
    clock += day;  
    return clock;   
}

$('#sTime').datebox('setValue', getCurentDateStr());  
$('#sTime').datebox('calendar').calendar({
    validator: function(date){
    var now = new Date();
    var d = new Date(now.getFullYear(), now.getMonth(), now.getDate()+1);
    return date>=d;
    }
});


$("#sTime").datebox({
    onSelect : function(beginDate){
        $('#eTime').datebox().datebox('calendar').calendar({
        validator: function(date){
            return beginDate<=date;
        }
        });
    }
});

4.判断日期,时间大小
日期:
var arrA=$("#whtd").textbox("getText").split("-");
var dateA=new Date(arrA[0],arrA[1]-1,arrA[2]).getTime();
var arrB=$("#whtu").textbox("getText").split("-");
var dateB=new Date(arrB[0],arrB[1]-1,arrB[2]).getTime();


if(dateA > dateB){
    $("#whtError").show();
}else{
    var param = sy.serializeObject($('#condForm'));
    $('#dataGrid').datagrid('load',param);
}

时间:
function compareTime(startDate, endDate) {   
    if (startDate.length > 0 && endDate.length > 0) {   
        var startDateTemp = startDate.split(" ");   
        var endDateTemp = endDate.split(" ");   

        var arrStartDate = startDateTemp[0].split("-");   
        var arrEndDate = endDateTemp[0].split("-");   

        var arrStartTime = startDateTemp[1].split(":");   
        var arrEndTime = endDateTemp[1].split(":");   

        var allStartDate = new Date(arrStartDate[0], arrStartDate[1], arrStartDate[2], arrStartTime[0], arrStartTime[1], arrStartTime[2]);   
    var allEndDate = new Date(arrEndDate[0], arrEndDate[1], arrEndDate[2], arrEndTime[0], arrEndTime[1], arrEndTime[2]);   

    if (allStartDate.getTime() >= allEndDate.getTime()) {   
        alert("startTime不能大于endTime,不能通过");   
        return false;   
    } else {   
        alert("startTime小于endTime,所以通过了");   
        return true;   
           }   
    } else {   
        alert("时间不能为空");   
        return false;   
        }   
    }  
}
//比较日期,时间大小  
function compareCalendar(startDate, endDate) {   
if (startDate.indexOf(" ") != -1 && endDate.indexOf(" ") != -1 ) {   
    //包含时间,日期  
        compareTime(startDate, endDate);               
} else {   
    //不包含时间,只包含日期  
    compareDate(startDate, endDate);   
      }   
}

  相关解决方案