- Embedding data in hidden HTML elements and retrieving text lines in a platform-independent fashion
- Using a stylish form fieldset
- Making clickable descriptions for checkboxes and radio buttons by using labels
- Using CSS list-style-image to make beautiful bulleted lists
My Web programming has never been the same since I learned how to use fieldsets to make beautiful forms in Web pages. Best of all, there's no bandwidth intensive imagery to use - it's built into the HTML!
While on the topic of forms, usability and efficiency increase in importance when check boxes and radio buttons are provided with clickable descriptions. Many people expect to click the descriptions, anyway, from experience with other programs. It would be sad to disappoint them, especially when HTML provides an excellent and natural way of doing it.
As a Grand Finale, you'll learn about one of the classic tricks of stylesheets. Using deluxe bullets for your lists will make your Web site more professional and appealing.
Getting Data From Text Lines in Hidden HTML Elements
Data for a script program can be embedded efficiently directly into the HTML source code, either in a hidden input field or a hidden HTML element. A script which reads this data has to perform a small number of steps.
- Hide the data contents of the hidden field in the HTML document
- Refer to the data using the document object model
- Normalize the line breaks for cross-platform compatibility
- Trim white space and remove empty lines or comments if desired
The result is displayed at right:
Later, I'll write an article discussing some spreadsheet and statistics functions which can be applied to data embedded into an HTML document. At the end of every semester I prepare a quality of teaching report which uses these functions to compute statistics and correlations from classroom data. The first step is how to interpret text lines as comma separated values (CSV) or as data fields delimited in other ways.
The comparison function returns a value greater than zero or less than zero depending on which element should be sorted first. When the sorting algorithm is executed the data will be randomized if the comparison function gives each comparison of elements an equal probability of being greater than zero or less than zero.
Some high-speed sorting algorithms are unstable, and might not result in all data being truly randomized. In a sense, one could say that the sorting algorithm divides up the data too fast for the randomizing to occur. A truly random shuffling has the property that each element has the same probability of being assigned to each location, or equivalently, each permutation of objects is equally likely. As far as I know, Safari is the only browser which may have an unstable sorting algorithm, resulting in the domain uuuuu.us being sorted to the last position most of the time, although other domains appear to be randomly placed. Unstable sorting algorithms may be fine, depending on the application.
There are also iterative methods for sorting. Iterative sorting methods are useful because the computational cost of one iteration is O(N) rather than O(n log N). A precise estimate is typically from N/2 to 2N. The data is not completely sorted after one iteration, but that's fine when the data ranking is based on subjective criteria such as clicking popularity or Google PageRank. Usually a good iterative sorting method guarantees that at least the lowest and highest ranked items are sorted to the correct positions.