Let JavaScript do the work for you
So let's look at a much more elegant and modular approach to solving
this problem. The idea is to have the controls initialized by
JavaScript functions that are executed when the HTML-page has loaded.
We'll need a JavaScript function for each of the controls. The
functions will have two parameters. The first is the name of the
control, the other is the value to assign to the control:
|
Control type |
JavaScript function |
|
Text |
initText(control,value) |
|
Text area |
initTextArea(control,value) |
|
Radio button |
initRadio(control,value) |
|
Check box single |
initCheckBox(control,value) |
|
Check box multiple |
initCheckBoxMulti(control,value) |
|
Selection list single |
initSelect(control,value) |
|
Selection list multiple |
initSelectMulti(control,value) |
All functions can be found in init.js used
in thenext example, but to give you an idea of how
they work, here's the simplest one, which handles the text field:
function initText(control,value) {
// Initialize a text field
control.value = value;
}
When the page loads you should call an init-function for each of
your controls. This may be accomplished through the BODY-tag's
onload-event. Your page will therefore look something
like this using JSP:
<%
// Get data for the form from somewhere...
String pname = ...
String paddress = ...
String age = ...
String mail = ...
String comments ...
%>
<html>
<head>
<script language="javascript" src="init.js"></script>
<script>
function initAll(form) {
// Initialize all form controls
with (form) {
initText(pname,"<%=pname%>");
initText(paddress,"<%=paddress%>");
initSelect(age,"<%=age%>");
initCheckBox(mail,"<%=mail%>");
initTextArea(comments,"<%=comments%>");
}
}
</script>
</head>
<body onload="initAll(document.myform)">
<form name=myform method=post action="next.jsp">
Your name: <input type=text name=pname><br>
Your address: <input type=text name=paddress><br>
State: <select name=age size=4>
<option value=0>0-20
<option value=1>21-40
<option value=2>41-60
<option value=3>61-
</select><br>
On mailing list? <input type=checkbox name=mail><br>
Comments: <textarea name=comments rows=5></textarea>
</form>
</body>
</html>
As you can see, we now have a much more readable program structure.
One function call for each form control, and minimal JSP coding
inside the HTML-section.
Alas, more challenges
Is that all? Not quite, two issues are still open.
First we should consider "multi-valued controls", that
is the controls that may
return more than one value. These are:
- the selection list if you have used the "multiple"
option, e.g. <select name=msel size=3 multiple>
- a group of check boxes, all having the same name
A simple way to handle these values is to pass them to the
init-functions as a comma-separated string. So if you have
defined a selection list like this:
<select name=channels size=3 multiple>
<option value=0>CNN
<option value=1>Eurosport
<option value=2>BBC
</select>
and CNN and BBC was selected, you would use this init-call:
initSelectMulti(channels,"0,2");
It probably goes without saying that in order for this to work you
must not use commas in the actual values used in form controls.
Something like <input type=checkbox name=browser
value="NN,4"> is not allowed.
New on the Java Boutique:
New Review:
Time Management Made Easy with the Quartz Enterprise Job Scheduler
Why not just use the Java timer API? This open source scheduling
API boasts simplicity, ease-of-integration, a well-rounded feature
set, and it's free!
New Applet:
Reverse Complement
Reverse Complement is a simple applet that converts DNA or RNA
sequences into three useful formats.
Elsewhere on internet.com:
WebDeveloper Java
Lots of Java information on webdeveloper.com
WDVL Java
Thorough Java resource at the Web Developer's Virtual Library.
ScriptSearch Java
Hundreds of free Java code files to download.
jGuru: Your View of the Java Universe
Customizable portal with online training, FAQs, regular news updates, and tutorials.
|