1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
|
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Flying Saucer: XHTML Forms Support</title>
<link rel="stylesheet" type="text/css" href="general.css" title="Style" media="screen" />
<link rel="stylesheet" type="text/css" href="print.css" title="Style" media="print" />
</head>
<body>
<p class="link left-link"><a href="demoNav:back">Previous Page</a></p>
<p class="link right-link"><a href="demoNav:forward">Next Page</a></p>
<p id="fslogo">Flying Saucer XML/CSS2 Renderer</p>
<span id="pagebyline">XHTML Forms Support</span>
<br />
<p><b>Forms support includes</b>: Any XML/XHTML element can be "replaced" during the rendering cycle with a component
that knows how to draw itself. This means we can replace XHTML form elements with, for example, Swing components. It also
allows us to replace SVG tags with rendered SVG images, and so on. This page shows how a XHTML form is rendered via Swing;
one could also use another GUI toolkit for Java (AWT, Thinlet, etc). FS doesn't currently support form submission out of
the box, but it can be added--the Swing components replaced in the page are just normal Swing components to which listeners
can be attached. Note that as with HTML, you can freely mix formatted text, images and CSS formatting with form elements.</p>
<br />
<h3>Example Form Components</h3>
<form action="">
<input type="hidden" name="MyHiddenField" value="This should be hidden, but its not at the moment!"/>
<table>
<tbody>
<tr><td>First Name:</td><td><input type="text" name="FirstName" value=""/></td></tr>
<tr><td>Last Name:</td><td><input type="text" name="LastName" value=""/></td></tr>
<tr><td>Address:</td><td><input type="text" name="AddressLine1" value=""/></td></tr>
<tr><td>Address (cont.):</td><td><input type="text" name="AddressLine2" value="Suite D" readonly="readonly"/></td></tr>
<tr><td>City:</td><td><input type="text" name="City" value=""/></td></tr>
<tr>
<td>State:</td>
<td>
<select name="State">
<option value="">-- Select --</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">District of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
</td>
</tr>
<tr><td>Zip:</td><td><input type="text" name="ZipCode" size="5" maxlength="5" /></td></tr>
<tr>
<td>Interests:<br /><i>(Select all that apply)</i></td>
<td>
<select name="Interests" multiple="true" size="8">
<option value="1">Meeting new people</option>
<option value="2">Networking</option>
<option value="3">Romance</option>
<option value="4">A lucrative book deal</option>
<option value="5" selected="selected">Writing Java code</option>
</select>
</td>
</tr>
<tr>
<td>Favorite Band:</td>
<td>
<select name="FavoriteBand" size="8">
<option value="1">The Beatles</option>
<option value="2">U2</option>
<option value="3">The Rolling Stones</option>
<option value="4">Pearl Jam</option>
<option value="5">Phish</option>
<option value="6">Coldplay</option>
</select>
</td>
</tr>
<tr>
<td>Contact method:</td>
<td>
<input type="radio" name="ContactMethod" value="Mail" /> Mail<br />
<input type="radio" name="ContactMethod" value="E-mail" /> E-mail
</td>
</tr>
<tr>
<td>Preferred e-mail format:</td>
<td>
<input type="radio" name="EmailFormat" value="None" checked="checked" /> No Preference<br />
<input type="radio" name="EmailFormat" value="Plain" /> Plain Text<br />
<input type="radio" name="EmailFormat" value="HTML" /> XHTML
</td>
</tr>
<tr>
<td>Chosen Username:</td>
<td><input type="text" name="Username" /> <input type="button" name="CheckButton" value="Available?" disabled="disabled" /></td>
</tr>
<tr>
<td>Password:</td>
<td><input type="password" name="Password" /></td>
</tr>
<tr>
<td>Confirm Password:</td>
<td><input type="password" name="ConfirmPassword" /></td>
</tr>
<tr><td colspan="2">Comments:</td></tr>
<tr><td colspan="2"><textarea name="Comments" rows="6" cols="45" /></td></tr>
<tr><td colspan="2">Delivery Instructions:</td></tr>
<tr><td colspan="2"><textarea name="Instructions" rows="3" cols="45" /></td></tr>
<tr><td colspan="2"><input type="checkbox" name="SendMail" value="1" /> Yes, I would like to be included on your mailing list.</td></tr>
<tr><td colspan="2"><input type="checkbox" name="FreeCash" value="1" checked="checked" /> Yes, send me a wad of free cash!</td></tr>
<tr><td colspan="2" align="right"><input type="reset" name="ResetForm" value="Clear"/> <input type="submit" name="FormPosted" value="Register!"/></td></tr>
</tbody>
</table>
</form>
</body>
</html>
|
