extjstimefiled时间下拉选择ampm的简单介绍

发布时间：2022-11-27

本文目录一览：

  1. extjs 控件事件大全
  2. extjs4中日期怎么比较大小？
  3. Extjs GridPanel构造器参数意思
  4. extjs timefield选择后显示Tue Jan 01 2008 00:30:00 GMT+0800 (中国标准时间)

extjs 控件事件大全

Ext.form.TimeField

配置项：

  • maxValue：列表中允许的最大时间
  • maxText：当时间大于最大值时的错误提示信息
  • minValue：列表中允许的最小时间
  • minText：当时间小于最小值时的错误提示信息
  • increment：两个相邻选项间的时间间隔，默认为15分钟
  • format：显示格式，默认为“g:i A”。一般使用“H:i:s”
    • H：带前缀0的24小时
    • i：带前缀0的分钟
    • s：带前缀0的秒
  • invalidText：当时间值非法时显示的提示信息
  • altFormats：多个时间输入格式组成的字符串，不同的格式之间使用“|”进行分割

Ext.form.FieldSet

  • animCollapse：动画折叠，默认为false
  • checkboxToggle：设置是否显示字段集的checkbox选择框，默认为false
  • checkboxName：指定字段集中用于展开或隐藏字段集面板的checkbox的名字，该属性只有在checkboxToggle为true时生效
  • labelWidth：字段标签的宽度，可以级联到子容器
  • layout：布局，默认为form

Ext.form.DateField

配置项：

  • maxValue：允许选择的最大日期
  • maxText：当日期大于最大值时的错误提示信息
  • minValue：允许选择的最小时间
  • minText：当日期小于最小值时的错误提示信息
  • format：日期显示格式，默认为“m/d/y”，一般使用“Y-m-d”
    • Y：四位年份
    • m：带前缀0的月份
    • d：带前缀0的日期
    • y：两位年份
    • n：不带前缀0的月份
    • j：不带前缀0的日期
    • w：星期的数字，0表示星期日，1代表星期一
  • showToday：是否显示今天按钮，默认为true
  • altFormats：多个日期输入格式组成的字符串，不同的格式之间使用“|”进行分割，默认值为'm/d/Y|n/j/Y|n/j/y|m/j /y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d'
  • disabledDates：禁止选择的日期组成的数组
  • disabledDatesText：选择禁选日期时显示的提示信息
  • disabledDays：禁止选择的星期组成的数组，0代表星期日，1代表星期一
  • disabledDaysText：选择禁选星期时显示的提示信息
  • invalidText：当日期值非法时显示的提示信息

方法：

  • getValue()：取得日期值

Ext.form.ComboBox

配置项：

  • displayField：被显示在下拉框中的字段名
  • editable：是否可编辑，默认为true
  • forceSelection：输入值是否严格为待选列表中存在的值。如果输入不存在的值，会自动选择第一个最接近的值。
  • hiddenName：隐藏字段的名字，如果提供该参数则一个隐藏字段将被创建，用来存储所选值，当表单提交时在服务器端可以通过该名字取得列表中的所选值
  • listWidth：下拉列表的宽度
  • minListWidth：下拉列表的最小宽度，默认为70像素
  • loadingText：当下拉框加载数据时显示的提示信息，只有当mode='remote'时才会生效
  • maxHeight：下拉列表框的最大高度，默认为300像素
  • minChars：下拉列表框自动选择前用户需要输入的最小字符数量。mode='remote'默认为4，mode='local'默认为0
  • mode：下拉列表框的数据读取模式。remote读取远程数据，local读取本地数据
  • pageSize：下拉列表框的分页大小。该项设置只在mode='remote'时生效
  • queryParam：查询的名字，默认为'query'，将被传递到查询字符串中
  • allQuery：一个发往服务器用来查询全部信息的查询字符串，默认为空字符串''
  • selectOnFocus：当获得焦点时立刻选择一个已存在的列表项。默认为false，此项只有在editable=true时才会生效
  • store：列表框绑定的数据源
  • transform：将页面中已存在的元素转换为组合框
  • lazyInit：延时初始化下拉列表，默认为true
  • lazyRender：延时渲染，默认为false
  • triggerAction：设置单击触发按钮时执行的默认操作，有效值包括all和query，默认为query，如果设置为all则会执行allQuery中设置的查询
  • typeAhead：设置在输入过程中是否自动选择匹配的剩余部分文本（选择第一个满足条件的），默认为false
  • value：初始化组合框中的值
  • valueField：组合框的值字段
  • valueNotFoundText：值不存在时的提示信息
  • tpl：Ext模板字符串或模板对象，可以通过该配置项自定义下拉列表的显示方式

方法：

  • clearValue()：清空字段当前值
  • doQuery( String query, Boolean forceAll )
  • getValue()
  • getStore()
  • setValue( String value )

Ext.form.RadioGroup

  • allowBlank
  • blankText

Ext.form.Radio

  • getGroupValue()
  • setValue( value {String/Boolean} )

Ext.form.CheckboxGroup

  • allowBlank：是否允许不选择，默认为true
  • blankText
  • columns：显示的列数，可选值包括：固定值auto、数值、数组（整数、小数）
  • items：对象数组
  • vertical：是否垂直方向显示对象，默认为false

Ext.form.Checkbox

  • boxLabel：复选框的文字描述
  • checked：复选框是否被选择，默认为false
  • handler：当checked值改变时触发的函数，函数包含两个参数：checkbox、checked
  • inputValue

方法：

  • getValue()：返回复选框的checked状态
  • setValue( Boolean/String checked )

Ext.form.NumberField

  • allowDecimals：是否允许输入小数，默认为true
  • allowNegative：是否允许输入负数，默认为true
  • baseChars：输入的有效数字集合，默认为'0123456789'
  • decimalPrecision：数字的精度，默认保留小数点后2位
  • decimalSeparator：十进制分隔符，默认为'.'
  • maxValue：允许输入的最大数值
  • maxText：超过最大值之后的提示信息
  • minValue：允许输入的最小数值
  • minText：超过最小值之后的提示信息
  • nanText：输入非有效数值之后的提示信息

Ext.form.TextArea

  • preventScrollbars：是否禁止出现滚动条，默认为false

extjs4中日期怎么比较大小？

可以使用change事件，先获取到第一个时间，

var firstTimeValue = form.findField('firstTime').getValue();

然后对第二个时间做change事件，

'form timefield': {
  change: function(timefield) {
    var secondTimeValue = timefield.getValue();
    if (firstTimeValue > secondTimeValue) {
      Ext.Msg.show({
        title: '提示',
        msg: '时间输入不正确（开始日期不能大于结束日期）',
        buttons: Ext.Msg.OK,
        icon: Ext.Msg.ERROR
      });
    }
  }
}

Extjs GridPanel构造器参数意思

如楼上所说,其实都是一些简写,当然你可以把cm写成ColumModel, 系统定义了一套简写模式,叫做:ExtJs中的xtype类型.

定义

xtype就是一个代表类（Class）的标识名字。 譬如，你有这个类，名字是Ext.ux.MyGrid。正常情况下你需要用这个名字来实例化这个类（创建类的对象）。 除了类名外，你还可以这样登记类的xtype：

Ext.reg('mygrid', Ext.ux.MyGrid);

其中xtype 是 mygrid 而类名的一般形式是 Ext.ux.MyGrid。上面的语句登记了新的xtype ，换种说法说，xtype mygrid 与类 Ext.ux.MyGrid是连在一起的。

到底有什么好处？

延时实例化 下面是一些资料,但是不全,你在网上再找找吧,我也初学

基本组件：

xtype Class 描述
button Ext.Button 按钮
splitbutton Ext.SplitButton 带下拉菜单的按钮
cycle Ext.CycleButton 带下拉选项菜单的按钮
buttongroup Ext.ButtonGroup 编组按钮(Since 3.0)
slider Ext.Slider 滑动条
progress Ext.ProgressBar 进度条
statusbar Ext.StatusBar 状态条，2.2加进来，3.0 又去了
colorpalette Ext.ColorPalette 调色板
datepicker Ext.DatePicker 日期选择面板

容器及数据类组件：

xtype Class 描述
window Ext.Window 窗口
viewport Ext.ViewPort 视口，即浏览器的视口，能随之伸缩
box Ext.BoxComponent 盒子组件，相当于一个 div
component Ext.Component 组件
container Ext.Container 容器
panel Ext.Panel 面板
tabpanel Ext.TabPanel 选项面板
treepanel Ext.tree.TreePanel 树型面板
flash Ext.FlashComponent 显示 Flash 的组件(Since 3.0)
grid Ext.grid.GridPanel 表格
editorgrid Ext.grid.EditorGridPanel 可编辑的表格
propertygrid Ext.grid.PropertyGrid 属性表格
editor Ext.Editor 编辑器
dataview Ext.DataView 数据显示视图
listview Ext.ListView 列表视图

工具栏组件：

xtype Class 描述
paging Ext.PagingToolbar 分页工具条
toolbar Ext.Toolbar 工具栏
tbbutton Ext.Toolbar.Button 工具栏按钮
tbfill Ext.Toolbar.Fill 工具栏填充区
tbitem Ext.Toolbar.Item 工具条项目
tbseparator Ext.Toolbar.Separator 工具栏分隔符
tbspacer Ext.Toolbar.Spacer 工具栏空白
tbsplit Ext.Toolbar.SplitButton 工具栏分隔按钮
tbtext Ext.Toolbar.TextItem 工具栏文本项

菜单组件：

xtype Class 描述
menu Ext.menu.Menu 菜单
colormenu Ext.menu.ColorMenu 颜色选择菜单
datemenu Ext.menu.DateMenu 日期选择菜单
menubaseitem BaseItem
menucheckitem Ext.menu.CheckItem 选项菜单项
menuitem Ext.menu.Item
menuseparator Ext.menu.Separator 菜单分隔线
menutextitem Ext.menu.TextItem 文本菜单项

表单及表单域组件：

xtype Class 描述
form Ext.FormPanel/Ext.form.FormPanel 表单面板
checkbox Ext.form.Checkbox 多选框
combo Ext.form.ComboBox 下拉框
datefield Ext.form.DateField 日期选择项
timefield Ext.form.TimeField 时间录入项
field Ext.form.Field 表单字段
fieldset Ext.form.FieldSet 表单字段组
hidden Ext.form.Hidden 表单隐藏域
htmleditor Ext.form.HtmlEditor HTML 编辑器
label Ext.form.Label 标签
numberfield Ext.form.NumberField 数字编辑器
radio Ext.form.Radio 单选按钮
textarea Ext.form.TextArea 多行文本框
textfield Ext.form.TextField 表单文本框
trigger Ext.form.TriggerField 触发录入项
checkboxgroup Ext.form.CheckboxGroup 编组的多选框(Since 2.2)
displayfield Ext.form.DisplayField 仅显示，不校验/不被提交的文本框
radiogroup Ext.form.RadioGroup 编组的单选按钮(Since 2.2)

图表组件：

xtype Class 描述
chart Ext.chart.Chart 图表组件
barchart Ext.chart.BarChart 柱状图
cartsianchart Ext.chart.CartesianChart
columnchart Ext.chart.ColumnChart
linechart Ext.chart.LineChart 连线图
piechart Ext.chart.PieChart 扇形图

数据集 Store：

xtype Class 描述
arraystore Ext.data.ArrayStore
directstore Ext.data.DirectStore
groupingstore Ext.data.GroupingStore
jsonstore Ext.data.JsonStore
simplestore Ext.data.SimpleStore
store Ext.data.Store
xmlstore Ext.data.XmlStore

extjs timefield选择后显示Tue Jan 01 2008 00:30:00 GMT+0800 (中国标准时间)

这种情况下应该是需要字符串格式的时间，但是你给的是数字格式的时间。例如 将2019换成'2019'，就可以解决此项提醒。

推荐文章