|
|
|
Understanding Checkboxes
in HTML Forms - Part 1
By Kevin
Runner, Runner Technologies
Checkboxes are an excellent way to represent two-state columns to the user. They are intuitive for the end-user, however they can be a bit tricky to implement for the web developer.
Checkboxes are commonly referred to as flags or indicators. Database columns are typically represented as checkboxes when they are length of one (1) character or number, such as VARCHAR2(1) or NUMBER(1). Valid values for a column like this are usually 1/0 or Y/N, representing an On/Off state.
We'll start this topic with a simple example, assuming we have a one record web page containing a checkbox. Checkboxes for multi-record pages are more advanced and will be discussed in the next issue.
EXAMPLE:
Assume our column name is "locked_flag" and it has valid values of 1 for TRUE and 0 for FALSE. The following HTML code could be used to display the checkbox on a web page:
Unchecked
State:
<INPUT type="checkbox" name="locked_flag"
value="1"> Locked
Checked
State:
<INPUT type="checkbox" name="locked_flag"
value="1" CHECKED> Locked
Notice the only difference between the two states is the keyword "CHECKED", without a name/value pair.
Now let's take a look at some ways to programmatically display the correct state of a checkbox field for a queried record.
PL/SQL
DEVELOPERS:
------------------
To minimize the amount of if-then coding, create a Get_Checked_State function
which returns:
NULL
if the value is FALSE (0, 'N', FALSE, NULL)
'CHECKED' if the value is
TRUE (1, 'Y', TRUE).
<-------------------
CUT AND PASTE -------------------> FUNCTION Get_Checked_State
(fv_checkbox_value IN VARCHAR2) RETURN VARCHAR2 IS BEGIN
if upper(NVL(fv_checkbox_value,'N'))
in ('Y','1','TRUE') then
return 'CHECKED';
else
return NULL;
end if;
END Get_Checked_State;
<------------------- CUT AND PASTE ------------------->
To use this with the PL/SQL Web Toolkit:
htp.p('<INPUT
type="checkbox" name="locked_flag" value="1" '||
Get_Checked_State(locked_flag)||'>
Locked');
ORBIT
DEVELOPERS:
-----------------
Use
the .CHECKED token modifier to dynamically display the
CHECKED keyword based on the value of the token.
I.e.
<INPUT type="checkbox" name="locked_flag"
value="1" #locked_flag.CHECKED#> Locked
DESIGN
NOTE 1:
--------------
Use a consistent naming standard for flag or indicator type columns. Pick a methodology and stick to it. We always use _FLAG as a suffix in column names. Another common suffix is _IND (for indicator).
DESIGN
NOTE 2:
--------------
Use a consistent datatype for flag type columns. We always use NUMBER(1) with valid values of 0 and 1. Another common datatype is VARCHAR2(1), with values of 'N' and 'Y', however this is not very language independent. Also define a default value representing the FALSE or off state. Name the column accordingly.
Some
Rules for handling checkboxes:
-----------------------------------
Remember:
HTML Forms only send the value of a checkbox when
the checkbox is checked, otherwise it's like not having the checkbox on the
form at all. Keep this in mind when you're updating a record and the
checkbox is not checked. You'll
need to use the NVL function around the checkbox value for getting the
unchecked state.
I.e. update
<table> set
locked_flag =
NVL(fv_locked_flag, 0)
where <where_clause>;
Always
have a DEFAULT clause in the procedure parameter to allow for when the
checkbox is unchecked.
I.e. my_flag IN VARCHAR2 DEFAULT NULL
Name
the parameters consistently:
- Use a suffix like _FLAG or _IND, based on your standards.
Unlike
text fields where the prompt goes on the left, checkbox
prompts should always go on the right.
The
checkbox prompt should normally not include the
word flag or indicator, as this is implied by the checkbox itself. In our example above, we used
"Locked" instead of "Locked Flag" for the prompt.
When checkboxes are displayed for multiple records, they should be centered below the prompt header.
In the next series on this topic, we'll look at how to handle checkboxes in multi-record forms.