Page Menu
Home
Code
Search
Configure Global Search
Log In
Files
F884904
test_DateTextBox.html
No One
Temporary
Actions
Download File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Flag For Later
Size
4 KB
Subscribers
None
test_DateTextBox.html
View Options
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<
html
>
<
head
>
<
title
>
Test DateTextBox Widget
</
title
>
<
script
type
=
"text/javascript"
src
=
"../../../dojo/dojo.js"
djConfig
=
"isDebug: true, parseOnLoad: true, extraLocale: ['de-de', 'en-us']"
></
script
>
<
script
type
=
"text/javascript"
src
=
"../_testCommon.js"
></
script
>
<
script
type
=
"text/javascript"
>
dojo
.
require
(
"dijit.form.DateTextBox"
);
dojo
.
require
(
"dojo.date.locale"
);
dojo
.
require
(
"dojo.parser"
);
// scan page for widgets and instantiate them
</
script
>
<
style
type
=
"text/css"
>
@
import
"../../../dojo/resources/dojo.css"
;
@
import
"../css/dijitTests.css"
;
.
testExample
{
background-color
:
#fbfbfb
;
padding
:
1
em
;
margin-bottom
:
1
em
;
border
:
1
px
solid
#bfbfbf
;
}
.
small
{
width
:
3
em
;
}
.
medium
{
width
:
10
em
;
}
.
long
{
width
:
20
em
;
}
.
verylong
{
width
:
700
px
;
}
.
noticeMessage
{
color
:
#093669
;
font-size
:
0.95
em
;
margin-left
:
0.5
em
;
}
.
dojoTitlePaneLabel
label
{
font-weight
:
bold
;
}
</
style
>
</
head
>
<
body
>
<
h1
class
=
"testTitle"
>
Test DateTextBox Widget
</
h1
>
<!-- to test form submission, you'll need to create an action handler similar to
http://www.utexas.edu/teamweb/cgi-bin/generic.cgi -->
<
form
id
=
"form1"
action
=
""
name
=
"example"
method
=
"post"
>
<
div
class
=
"dojoTitlePaneLabel"
>
<
label
for
=
"q1"
>
Date (local format)
</
label
>
<
span
class
=
"noticeMessage"
>
DateTextBox class, no attributes
</
span
>
</
div
>
<
div
class
=
"testExample"
>
<
input
id
=
"q1"
name
=
"noDOMvalue"
type
=
"text"
dojoType
=
"dijit.form.DateTextBox"
>
</
div
>
<
div
class
=
"dojoTitlePaneLabel"
>
<
label
for
=
"q2"
>
Date (local format - long)
</
label
>
<
span
class
=
"noticeMessage"
>
DateTextBox class,
Attributes: required="true", trim="true", constraints={min:'2004-01-01',max:'2006-12-31',formatLength:'long'}. Works for leap years
</
span
>
</
div
>
<
div
class
=
"testExample"
>
<
input
id
=
"q2"
type
=
"text"
name
=
"date1"
class
=
"medium"
value
=
"2005-12-30"
dojoType
=
"dijit.form.DateTextBox"
constraints
=
"{min:'2004-01-01',max:'2006-12-31',formatLength:'long'}"
required
=
"true"
trim
=
"true"
promptMessage
=
"mm/dd/yyyy"
onChange
=
"dojo.byId('oc2').value=arguments[0]"
invalidMessage
=
"Invalid date. Use mm/dd/yyyy format."
/>
onChange:
<
input
id
=
"oc2"
size
=
"34"
disabled
value
=
"not fired yet!"
autocomplete
=
"off"
>
<
input
type
=
"button"
value
=
"Destroy"
onClick
=
"dijit.byId('q2').destroy(); return false;"
>
</
div
>
<
div
class
=
"dojoTitlePaneLabel"
>
<
label
for
=
"q3"
>
Date (American format)
</
label
>
<
span
class
=
"noticeMessage"
>
DateTextBox class,
Attributes: lang="en-us", required="true", constraints={min:'2004-01-01',max:'2006-12-31'}. Works for leap years
</
span
>
</
div
>
<
div
class
=
"testExample"
>
<
input
id
=
"q3"
type
=
"text"
name
=
"date2"
class
=
"medium"
value
=
"2005-12-30"
dojoType
=
"dijit.form.DateTextBox"
constraints
=
"{min:'2004-01-01',max:'2006-12-31'}"
lang
=
"en-us"
required
=
"true"
promptMessage
=
"mm/dd/yyyy"
invalidMessage
=
"Invalid date. Use mm/dd/yyyy format."
/>
</
div
>
<
div
class
=
"dojoTitlePaneLabel"
>
<
label
for
=
"q4"
>
Date (German format)
</
label
>
<
span
class
=
"noticeMessage"
>
DateTextBox class,
Attributes: lang="de-de", constraints={min:2004-01-01, max:2006-12-31}. Works for leap years
</
span
>
</
div
>
<
div
class
=
"testExample"
>
<
input
id
=
"q4"
class
=
"medium"
/>
</
div
>
<
script
>
// See if we can make a widget in script and attach it to the DOM ourselves.
dojo
.
addOnLoad
(
function
(){
var
props
=
{
name
:
"date4"
,
value
:
new
Date
(
2006
,
10
,
29
),
constraints
:
{
min
:
new
Date
(
2004
,
0
,
1
),
max
:
new
Date
(
2006
,
11
,
31
)},
lang
:
"de-de"
,
promptMessage
:
"dd.mm.yy"
,
rangeMessage
:
"Enter a date in 2006."
,
invalidMessage
:
"Invalid date. Use dd.mm.yy format."
};
var
w
=
new
dijit
.
form
.
DateTextBox
(
props
,
"q4"
);
});
</
script
>
<
script
>
function
displayData
()
{
var
f
=
document
.
getElementById
(
"form1"
);
var
s
=
""
;
for
(
var
i
=
0
;
i
<
f
.
elements
.
length
;
i
++
)
{
var
elem
=
f
.
elements
[
i
];
if
(
elem
.
name
==
"button"
)
{
continue
;
}
s
+=
elem
.
name
+
": "
+
elem
.
value
+
"\n"
;
}
alert
(
s
);
}
</
script
>
<
div
>
<
button
name
=
"button"
onclick
=
"displayData(); return false;"
>
view data
</
button
>
<
input
type
=
"submit"
name
=
"submit"
/>
</
div
>
</
form
>
</
body
>
</
html
>
File Metadata
Details
Attached
Mime Type
text/html
Expires
Sun, Apr 6, 11:24 (2 w, 19 h ago)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
24550
Default Alt Text
test_DateTextBox.html (4 KB)
Attached To
rZED Zed
Event Timeline
Log In to Comment