`

easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大

阅读更多

easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大

 

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>..

 Copyright © 蕃薯耀 2017年1月12日 10:18:53 星期四

http://fanshuyao.iteye.com/

 

一、Html代码

注意的是需要加上data-options="editable:false",不能直接修改日期

<tr>
  <td width="15%" class="label">合同起始日期:</td>
  <td width="35%">
    <input value="${loan.contractBegtime}" class="f1 easyui-datebox" id="contractBegtime" name="contractBegtime" data-options="required:true,editable:false"/>
    <font class="star-red">*</font>
  </td>
<td width="15%" class="label">合同截止日期:</td>
<td width="35%">
    <input value="${loan.contractEndtime}" class="f1 easyui-datebox" id="contractEndtime" name="contractEndtime" data-options="required:true,editable:false"/>
    <font class="star-red">*</font>
  </td>
</tr>

 

二、js代码限制

 

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

 

增加限制后,选择起始日期后,截止日期就必须比起始日期大,如果想截止日期也可以等于起始日期,

就使用<=。

再提醒:增加设置data-options="editable:false",不然截止日期可以直接修改成小于起始日期的时间

 

有其它要求的,可以查看官方文档:

http://www.jeasyui.net/demo/345.html

 

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>..

 Copyright © 蕃薯耀 2017年1月12日 10:18:53 星期四

http://fanshuyao.iteye.com/

1
1
分享到:
评论
1 楼 蕃薯耀 2017-01-12  
easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大

>>>>>>>>>>
蕃薯耀

相关推荐

    easyui的datebox限定范围

    本篇文章将详细讲解如何利用EasyUI的DateBox组件设定日期范围,确保用户选择的开始时间和结束时间之间的间隔不超过一个月。 首先,让我们了解DateBox的基本用法。DateBox是基于jQuery和jQuery UI的日期输入框组件,...

    easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大的实现代码

    本文将详细介绍如何使用EasyUI Datebox设置时间限制,包括开始时间与结束时间的关联限制,以及确保截止日期始终大于或等于起始日期的实现代码。 一、HTML代码部分 在HTML部分,我们需要创建两个Datebox输入框,...

    更改easyui-datebox日期格式

    解决easyui-datebox日期格式,只需引入此包即可,不需改源码

    EasyUI Datebox 日期验证之开始日期小于结束时间

    本文将详细讲解如何使用EasyUI Datebox 进行日期验证,特别是实现开始日期小于结束时间的验证规则。 首先,我们需要创建两个Datebox,一个用于选择开始日期,另一个用于选择结束日期。在HTML代码中,我们创建了两个...

    jquery easyui 周历 周选择下拉控件

    首先,jQuery EasyUI提供了一套完整的日期选择器(datebox)和日期时间选择器(datetimebox),但它们默认并不支持直接选择一周。为了满足周选择的需求,我们需要对原有的控件进行扩展和改造。这个"周历 周选择下拉...

    EasyUI修改DateBox和DateTimeBox的默认日期格式示例

    在 EasyUI 中,DateBox 和 DateTimeBox 是两个常用的日期选择控件,它们提供了方便的方式来输入和显示日期或日期时间信息。这两款控件在功能上非常相似,主要的区别在于 DateTimeBox 还包含了时间部分。 DateBox ...

    给Easyui-Datebox设置隐藏或者不可用的解决方法

    最近我在做一个安全监测系统,选择了用easyui进行搭建,easyui是一种基于jQuery的用户界面插件集合。使用easyui可以省去很多代码,功能上需要加...下面小编给大家介绍下给Easyui-Datebox设置隐藏或者不可用的解决方法

    给easyui datebox扩展一个清空的实例

    在本文中,我们将深入探讨如何为EasyUI Datebox组件扩展一个清空功能,这是一个非常实用的增强,使得用户能够方便地清除已选择的日期,从而提高用户体验。EasyUI 是一个基于 jQuery 的轻量级前端框架,它提供了一...

    easyui 日期选择器

    EasyUI 是一个基于 jQuery 的轻量级前端框架,它提供了丰富的组件,包括表格、下拉菜单、对话框、按钮、面板等,极大地简化了Web应用的开发。在这些组件中,日期选择器(Datebox)是一个非常常用的功能,用于用户...

    easyui 日期控件选择到月份

    easyui日期控件只选择到月份,保存记录一下。 &lt;input id="month" class="easyui-datetimebox" name="month" data-options="required:true,formatter:myformatter,parser:myParser" 160px" /&gt;

    jQuery EasyUI API 中文文档 - DateBox日期框

    jQuery EasyUI 是一个基于 jQuery 的前端框架,它为开发人员提供了构建现代 Web 应用程序的各种控件,其中 DateBox 是 jQuery EasyUI 中用于处理日期输入的控件。DateBox 控件允许用户通过一个文本输入框来选择或...

    jQuery EasyUI中的日期控件DateBox修改方法

    在jQuery EasyUI框架中,DateBox是一个非常实用的日期选择控件,它允许用户方便地选取日期,并且可以自定义显示样式和格式。在本文中,我们将深入探讨如何修改DateBox的一些关键设置,以适应不同的需求。 首先,...

    浅谈如何实现easyui的datebox格式化

    实现easyui的datebox格式化。效果如下,用“++”隔开,看你喜欢用什么都可以。   1、html 证件有效期至: &lt;span&gt;&lt;input id=passvali name=hotel.passvali&gt; 2、js /* 证件有效期至 */ $('#passvali')....

    Jquery EasyUI 日历Demo

    &lt;input type="text" class="easyui-datebox" placeholder="选择日期"&gt; ``` EasyUI 的日历组件默认支持日期选择,用户可以通过上下箭头或者直接输入日期进行选择。此外,我们还可以通过 JavaScript 代码进一步自定义...

    浅谈jQuery.easyui的datebox格式化时间

    Datebox是jQuery easyui组件之一,它用于在网页上创建一个输入框,用于日期选择。Datebox组件支持通过各种配置选项来定制其外观和行为,其中就包括日期格式化选项。 在使用jQuery easyui的datebox组件时,我们可能...

Global site tag (gtag.js) - Google Analytics