`
keepwork
  • 浏览: 332726 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

EXT--Extjs Ext.form.field.Date示例

    博客分类:
  • EXT
 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>日期控件</title> 
<link rel="stylesheet" href="ext-4.2.1.883/resources/css/ext-all.css" /> 
<script type="text/javascript" src="ext-4.2.1.883/bootstrap.js" ></script> 
<script type="text/javascript" src="ext-4.2.1.883/locale/ext-lang-zh_CN.js"></script> 
<script type="text/javascript"> 
Ext.onReady(function(){ 
Ext.QuickTips.init(); 
Ext.create('Ext.form.Panel',{ 
  title:'Ext.form.field.Date示例', 
  frame:true, 
  height:100, 
  width:300, 
  renderTo:Ext.getBody(), 
  bodyPadding:5, 
  items:[{ 
   fieldLabel:'日期选择框', 
   xtype:'datefield', 
   labelSeparator:':', //操作符 
   msgTarget:'side', //鼠标放上去在字段的右边显示错误信息 
   autoFitErrors:false, //展示错误信息时是否自动调整字段组件宽度 
   format:'Y年m月d日', 
   maxValue:'07/31/2013',//允许选择最大日期 
   minValue:'06/31/2012',//允许选择最小日期 
   disabledDates:['2008年3月20日'], 
   disabledDatesText:'禁止选择该日期', 
   width:240, 
   value:'06/25/2013', 
  showToday:false //如果为false 显示效果图如2 
   }] 
  }); 
}); 
</script> 
</head> 
<body> 
</body> 
</html> 
--------------------------------------------- 
注: 
showToday:true 设置是否显示‘今天’ 选择按钮,默认为true (所以一般不用写出来) 

 

开发者博客www.developsearch.com

分享到:
评论

相关推荐

    Ext Extjs 禁止文本和日期编辑

    var textField = Ext.create('Ext.form.field.Text', { fieldLabel: '文本字段', id: 'readOnlyTextField' }); // 动态设置 readOnly 为 true textField.setReadOnly(true); ``` 在上述代码中,我们首先创建了一...

    extjs详细ppt

    - **日期选择器 (`Ext.form.field.Date`)**:提供日期选择功能。 - **复选框组 (`Ext.form.field.CheckboxGroup`)**:一组复选框。 - **单选按钮组 (`Ext.form.field.RadioGroup`)**:一组单选按钮。 - **下拉...

    Ext日期时间控件 Spinner控件 Ext代码 Extjs Grid

    它提供了一个用户友好的界面,让用户能够方便地选择日期和时间,通常与`Ext.form.field.Date`或`Ext.picker.Date`类相关联。控件支持多种格式化选项,可以自定义日期的显示方式,还允许设置最小和最大日期范围,以...

    Ext Js权威指南(.zip.001

    8.1.3 格式化输出数据:ext.string、ext.number、ext.date和ext.util.format / 389 8.1.4 超级模板:ext.xtemplate(包括ext.xtemplateparser和ext.xtemplatecompiler) / 393 8.1.5 模板的方法 / 396 8.2 组件...

    extjs4.2 日期控件扩展带时分秒

    - 这个类继承自`Ext.form.field.Date`,并通过添加新的配置选项和方法来实现时间和日期的综合选择。 - **依赖组件**:`Ext.zc.form.DateTimePicker` - 此组件负责展示日期时间选择器界面,提供用户交互操作。 ###...

    Extjs中文教程2.x

    - **示例**: `new Ext.form.TextField({ labelWidth: 100, labelAlign: 'right', allowBlank: false, listeners: { afterrender: function(field) { field.el.on('mouseover', function(e) { var tip = new Ext....

    extjs时间控件精确秒

    EXTJS的时间控件主要通过`Ext.form.field.Time`类来实现。这个类提供了一个标准的时间输入框,用户可以从中选择一个时间或者手动输入。默认情况下,EXTJS的时间控件只显示小时和分钟,但我们可以配置它以显示精确到...

    ExtJs4.0 表单提交Demo

    - **创建表单组件**:首先,定义一个FormPanel,并在其内部添加所需的表单字段,例如`Ext.form.field.Text`、`Ext.form.field.Date`等。 - **配置表单行为**:为FormPanel设置action属性,指定提交的URL,或者在...

    ExtJS中editable-column-tree组件的使用 示例

    每列可以通过设置`editor`属性来指定编辑器类型,例如`Ext.form.field.Text`、`Ext.form.field.Date`等。同时,还需要确保`treePanel`启用了`viewConfig.enableTextSelection: true`,以便在编辑时能够正确选择和...

    EXT js 4带时间的日期控件

    EXT JS 4 的日期控件(`Ext.form.field.Date`)通常用于让用户选择一个日期。默认情况下,它只显示日期部分,但通过扩展或配置,我们可以让它包含时间选择。这个控件基于浏览器的原生日期选择器进行增强,提供了一种...

    无废话ExtJs 教程十二[员工信息表Demo:AddUser]

    4. `Ext.form.field.Text`、`Ext.form.field.Date`等:表示不同的输入控件,用于收集用户输入。 5. `Ext.button.Button`:创建添加按钮,点击后触发添加操作。 6. `form.submit()`:表单提交事件,可以将数据发送到...

    Extjs 5 日期时间控件

    该控件的核心是`Ext.form.field.DateTimePicker`类,它继承自`Ext.form.field.Date`和`Ext.picker.DateTimePicker`。开发者可以通过配置属性来定制控件的显示样式、日期格式、时间间隔等。例如,你可以设置日期格式...

    EXJJS4.07中date控件加入时和分

    首先,EXTJS的DateField控件是基于Ext.form.field.Date类实现的。我们可以通过创建一个新的类,继承自这个基类,并覆盖或扩展其默认配置来实现我们需要的功能。在新的类中,我们可以添加时间选择的相关配置,如时间...

    Extjs4 日期控件,带年月日时分秒

    ExtJS4中的日期字段(Ext.form.field.Date)是基础的日期选择组件。它使用内置的日期选择器小部件,允许用户选择一个日期。默认情况下,它只显示年、月、日,但可以通过配置扩展为包含时间元素。 2. **配置选项** ...

    extjs中文api

    var dateField = Ext.create('Ext.form.field.Date', { format: 'Y-m-d', altFormat: 'd/m/Y', submitValue: true, editable: false, allowBlank: false }); ``` 这里创建了一个日期选择器,设置了日期格式等...

    ext日期控件时分秒

    EXT JS的日期控件基于Ext.form.field.Date,它允许用户通过弹出的日历小部件选择日期。为了添加时间选择功能,我们需要一个能够处理时间和日期的混合控件。描述中提到的“ext自身控件不能选择时分秒”,意味着我们...

    extjs4能用的带时分秒的日期控件

    首先,ExtJS 4的日期时间控件一般会基于`Ext.form.field.Date`进行扩展,增加对时间的处理功能。开发者可能通过重写`createPicker`方法来创建一个包含时间选择的弹出窗口,并且修改模板以展示时、分、秒的部分。控件...

    extjs 4.0 日期时间控件

    3. **DateTime Field(日期时间字段)**:如果需要同时选择日期和时间,可以使用`Ext.form.field.DateTimePicker`。这个组件将日期和时间选择器整合在一个输入框中,提供了一站式的日期时间选择体验。 4. **格式化*...

    自动完成功能(AutoComplete) EXT+asp.net

    在EXT中,我们可以利用`Ext.form.field.Trigger`或`Ext.form.field.ComboBox`组件来实现自动完成功能。 首先,我们需要在服务器端建立一个C#服务,该服务负责处理来自客户端的请求,根据输入的查询字符串返回匹配的...

    ExtJs 3.0 中文文档(API)

    7. **表单处理**:Ext.form包是处理Web表单的核心,提供了各种表单字段(Field)、验证(Validation)和表单提交的功能。 8. **DHTML特效**:ExtJs还包括一些DHTML特效,如拖放(Drag & Drop)和动画(Animation)...

Global site tag (gtag.js) - Google Analytics