gpt4 book ai didi

javascript - 如何使用 Dijit DateTextBox 显示和验证自定义格式?

转载 作者:行者123 更新时间:2023-11-29 10:04:34 25 4
gpt4 key购买 nike

我想改变dijit dateTextBox的日期显示格式。
目前我的日期是这样显示的

enter image description here

我的声明是这样的

<input type="text" data-dojo-type="dijit/form/DateTextBox" data-dojo-attach-point="theInput"  />

但我想将格式更改为我想要的任何格式,例如 2017 年 9 月 14 日或 2017 年 9 月 14 日。

此外,如果使用键盘输入格式,是否可以针对相同格式进行验证 - 即当用户输入数据时,数据必须采用该格式,否则会出现无效消息。

编辑:我所能找到的只是提到了允许您设置输入约束和格式的约束 - 但文档中没有如何使用它的示例。很高兴看到声明性和编程性示例。

enter image description here

此外,根据此处声明性标记中的其他一些帖子,您可以指定约束条件,例如

data-dojo-props="constraints:{datePattern:'yyyy-MM'}" 

但是我想以编程方式执行此操作,但是当我检查输入对象时

this.theInput.constraints 

没有 datePattern 或 min 和 max 这样的属性。

最佳答案

程序性和声明性代码都是可能的:

  1. 对于声明性示例:

只需将您的 pattern 、 min 、 max 放在约束 Prop 中,例如:

<input type="text" name="shortYear" data-dojo-type="dijit/form/DateTextBox" data-dojo-props="constraints:{datePattern: 'MM-dd-yyyy',min:'2016-12', max:'2018-06'}" value="09-14-2017" required="true" />

查看工作 fiddle

require(["dijit/form/DateTextBox","dojo/parser", "dijit/form/Button","dojo/on" ,
"dojo/domReady!"
], function(DateTextBox,parser,Button, On ) {
parser.parse();
});
<link href="https://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dijit/themes/claro/claro.css" rel="stylesheet"/>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<body class="claro">
<input type="text" name="shortYear" data-dojo-type="dijit/form/DateTextBox" data-dojo-props="constraints:{datePattern: 'MM-dd-yyyy',min:'2017-09-03', max:'2018-01-01'}" value="09-14-2017" required="true" />
</body>

或者这个FIddle

  1. 程序示例:

你只是用来直接访问约束对象并在那里设置你的约束值Mydateinput.constraints.contName = value like

myDateBox.constraints.datePattern  = 'MM-dd-yyyy'
myDateBox.constraints.min = new Date();
myDateBox.constraints.max = new Date("yyyy-MM-dd")

查看工作片段

require(["dijit/form/DateTextBox", "dijit/form/Button","dojo/on" ,
"dojo/domReady!"
], function(DateTextBox,Button, On ) {
datebox = new DateTextBox({
}, "date");
datebox.constraints.datePattern = 'MM-dd-yyyy';

datebox.constraints.min = new Date("2017/09/03");
datebox.constraints.max = new Date("2018/01/01")

datebox.startup();
});
<link href="https://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dijit/themes/claro/claro.css" rel="stylesheet"/>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>

<body class="claro">
<div id="date" ></div>
</body>

或者 Fiddle

关于javascript - 如何使用 Dijit DateTextBox 显示和验证自定义格式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46452639/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com