javascript - ¿Cómo se muestra y se valida a un formato personalizado usando Dijit DateTextBox?

dojo dijit.form (1)

Quiero cambiar el formato de visualización de la fecha para dijit dateTextBox.
Actualmente mi fecha se muestra así

Mi declaración es así

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

Pero me gustaría cambiar el formato a cualquier formato que desee, por ejemplo, el 14 de septiembre de 2017 o el 14/09/2017.

Además, si ingresa el formato usando el teclado, ¿es posible validarlo con el mismo formato, es decir, cuando el usuario ingresa los datos debe estar en ese formato o aparece el mensaje no válido?

EDITAR : Todo lo que pude encontrar fue una mención de las restricciones que le permite establecer las restricciones de entrada y el formato, pero no hay ejemplos en la documentación de cómo usar esto. Sería bueno ver ejemplos declarativos y programáticos.

También de acuerdo con algunos otros mensajes aquí en marcado declarativo puede especificar restricciones como

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

Sin embargo, quiero hacer esto programáticamente, pero cuando inspecciono el objeto de entrada

this.theInput.constraints

no hay ninguna propiedad como datePattern, o min y max.

Es posible tanto para código programático como declarativo:

para el ejemplo declarativo:

simplemente ponga su patrón, mínimo, máximo en los apoyos de restricciones como:

<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" />

Ver trabajo violín

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>

O este FIddle

para el ejemplo programático:

solo tiene que usar para acceder directamente al objeto constraints y establecer su valor de restricción allí Mydateinput.constraints.contName = value like

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

Ver fragmento de trabajo

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(); });

O el violín