DHTML Form Enhancement
(Page 1 of 5 )
There are few tools to speed up form development. This article illustrates simple ways to provide some basic enhancements to your web application's forms such as validation, automatic submission, and hilighting of the field in focus.
Introduction
Something that all of us have done once if not a thousand times is website form processing. For those of us who prefer not to use .NET generated JScript for our forms, there are few tools available to speed up form development. This typically means coming up with your own somewhat generic server-side form processing tools and quite possibly no tools for clientside form development. According to the latest stats, 92% of Internet users have scripting enabled in their browsers. This means you still need to validate data on the serverside, but the user experience can greatly be enhanced by providing validation and other enhancements to the form.
It is implied that a form will be styled. Default form field style is quite unattractive and most always calls for some enhancement. The first thing we will discuss is simply making a form look nice. You should take a moment to consider the data that will be entered and fields and set their size attribute accordingly. Let's just take simple CSS like this:
select, input, textarea {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
background-color: #FFCF21;
border: 1px solid #292C31;
}
select.selected, input.selected, textarea.selected {
background-color: #FFFFFF;
}
You should also take advantage of the maxlength attribute to prevent users from putting too much data in a form. This will save some time with clientside validation. You should order the fields in as meaningful a way as possible with the fields organized in the form area neatly. With these things in mind, we will move on to some scripting.
Next: Visual Appeal >>
More HTML Articles
More By David Fells
/ 36 
