<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="${pageContext.request.scheme}://${pageContext.request.serverName}:${pageContext.request.serverPort}${pageContext.request.contextPath}/"/>
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="shared/example.css" />
<script type="text/javascript" src="js/ext/ext-all.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
Ext.onReady(function(){
//创建表单
Ext.create('Ext.form.Panel',{
title:'Ext.form.field.Time实例',
renderTo:'form',
bodyPadding:5,
frame:true,
height:100,
width:300,
items:[{
fieldLabel:'日起选择框',
xtype:'datefield',
width:240,
labelSeparator:':',
msgTarget:'side',//提示信息显示在字段的右边
autoFitErrors:false,//展示错误信息时是否调整字段组件的宽度
format:'Y年m月d日',//显示日起的格式
maxValue:'12/31/2015',//允许选择的最大日期
minVlue:'01/01/2008',//允许选择的最小日期
disabledDates:['2008年03月12日'],//禁止选择2008年3月12日
disabledDateText:'禁止选择该日期',
disabledDays:[0,6],//禁止选择星期六和星期日
disabledDaysText:'禁止选择该日期',
width:240,
value:'12/31/2008'
}]
});
});
</script>
</head>
<body>
<div id="form"></div>
</body>
</html>
disabledDates中设置的日期格式必须和format中的设置的日期格式相同否非无效；
maxValue和minValue中设置的日期格式必须是altFormat配置项中存在的日期格式，否则失效
分享到：
相关推荐
本篇我们将深入探讨“Extjs之旅”中的一个关键组件——Combox（组合框），特别是其远程加载数据的特性。 Combox在ExtJS中是一个非常灵活的控件，它可以看作是下拉列表和文本输入框的结合体，用户可以输入文本搜索，...
ExtJs常用布局--layout详解实例代码: ExtJs常见的布局方式有：border、form、absolute、column、accordion、table、fit、card、anchor 另外，不常见的布局有：tab、vbox、hbox 具体使用方法可见该文件的案例代码。 ...
本篇我们将聚焦于ExtJS中的一个特定控件——带分页的LOV（Look Up Value）Combo，它结合了Combobox和分页功能，方便用户在大量的数据中选择值。 LOV Combo（Look Up Value ComboBox）是ExtJS中的一种复合控件，它的...
8. **日期选择器（Date Picker）**：`Ext.picker.Date`则用于选择日期，它提供了一个日历视图让用户选择。配置选项包括开始和结束日期限制（`minDate`和`maxDate`）、默认显示日期（`value`）等。 9. **自定义控件*...
- 用户可以设置日期选择范围，如最小日期和最大日期，以及是否开启日期验证。 - 示例代码：`var dateField = new Ext.form.DateField({ ... });` 3. **扩展与自定义** - 在“extjs3.2、3.3 时间控件 日期控件...
首先，ExtJS 5 的日期时间控件（DateTimeField）结合了日期选择器（DatePicker）和时间选择器（TimePicker），提供了一种统一的用户输入日期和时间的方式。这个控件通常用于需要用户输入精确日期和时间的场景，比如...
在EXTJS6中，日期时间控件是一种强大的用户界面组件，它将传统的日期选择器与时间选择器结合在一起，提供了一种便捷的方式来输入和编辑日期和时间数据。这个控件在许多应用程序中都非常实用，特别是在那些需要精确...
extjs-620-docs官方文档extjs-620-docs官方文档extjs-620-docs官方文档
此"extjs-620-docs.rar"压缩包包含了该版本的完全离线版API文档，旨在解决在没有网络连接或网络环境不稳定时，开发者仍然可以便捷地查阅和学习ExtJS 6.2.0的相关知识。 API 文档是任何开发者的重要工具，特别是对于...
在EXTJS框架中，时间日期选择控件是一个重要的组件，特别是在构建用户界面时，需要用户输入精确的时间或日期信息。EXTJS 5.0及更高版本提供了更丰富的功能和改进的用户体验，使得开发者能够创建更加直观和用户友好的...
本文将详细介绍EXTJS 4.1中的日期时间选择控件，并针对可能存在的不合理之处进行讨论。 首先，EXTJS 4.1的日期时间控件主要由两个组件组成：`Ext.form.field.Date`和`Ext.picker.Date`，以及`Ext.form.field.Time`...
Extjs DateField控件 - 只选择年份（找了很久发现网上只有选择年月的控件，于是基于extjs年月控件设计了只选择年份的控件）
标题中的"extjs3.0 日期时间控件"指的是ExtJS 3.0框架中的DateTimeField组件，这是一个组合了日期选择器和时间选择器的控件，允许用户以交互的方式选择精确的日期和时间。这个控件通常用于表单中，提供了一种直观且...
在ExtJS 4.0中，日期时间控件通常由两个独立的组件组成：一个用于日期选择，另一个用于时间选择。它们可以单独使用，也可以组合在一起，形成一个完整的日期时间选择器。以下是一些关于这个控件的关键知识点： 1. **...
"extjs-theme-bootstrap" 是针对 EXTJS4 的一个主题，它借鉴了 Bootstrap 的设计风格，让 EXTJS4 应用程序具有更加现代化和一致的外观。 Bootstrap 是一个流行的前端开发框架，由 Twitter 推出，主要用于构建响应式...
语言程序设计资料：ExtJs学习笔记-2积分.doc
这个控件结合了日期选择器和时间选择器，使得用户可以选择一个精确的日期和时间点。创建控件时，需要设置一些基本属性，如宽度、高度、默认值等。例如： ```javascript var dateTimePicker = Ext.create('Ext....
ExtJS快速入门--传智播客--蔡世友
extJs-5.0.1-gpl附带sencha cmd安装程序、ruby编译包（分为32位和64位）和教程，一共四部分
总的来说，ExtJs4.1中的日期时间控件是通过扩展基础日期选择器并集成时间选择功能实现的。开发者可以通过自定义配置和事件处理来满足各种复杂的日期和时间选择需求，从而提高Web应用的交互性和可用性。