kae's site: datatables

The datatable function maintains (creates, destroys, modifies, etc) a flat-file database kept in the data directory.

Credits

The original function was written by myself, but a lot of work was donated by Douglas Hurst, particularly on accessibility, and source cleanup.

The Basics

The great power of this function is in it's simplicity of use - the most basic method to create a fully functional database using this is to simply place the function file in your main directory, create a data directory with full write permissions, and then simply call the function from within a php file. Here, for example, is an extremely simple source-file:

<html><body>
<? include("../../../../programming/datatables/kverens_subdomain/datatable.functions.txt"); datatable("test1","name|address|phone number"); ?>
</body></html>

This file can be seen in action here.

The above call creates a database that can be edited, appended, deleted, et cetera, by anyone. Note that the field names are separated by the symbol '|'.

The datatable() call has three parameters.

  1. The first is the filename to read/write from/to (the data file)
  2. The second is the field information so the table knows what to describe each piece of data as.
  3. The third parameter (optional) gives you the option to allow or disallow edits.

If you wanted to create something like a guestbook, you would not want people to go in and edit already entered data, so you could take out that ability by using the third parameter.

Parameter 3

optiondescriptionallowed valuesdefault
addallows new data to be entered'yes','no''yes'
editallows existing data to be edited'yes','no''yes'
deleteallows existing data to be deleted'yes','no''yes'
recordsnumber of records displayed per pagea number20

If you merely wanted to display the data, and not allow other people to edit it, then you just turn off the editable options:

<html><body>
<? include("../../../../programming/datatables/kverens_subdomain/datatable.functions.txt"); datatable("test1","name|address|phone number","edit=no|add=no|delete=no"); ?>
</body></html>

An example of the above can be seen here.

The table as is is very plain. If you wanted to spruce it up a bit, you can change the Parameter 2 settings.

Each field mentioned in the parameter is defined as a group of strings separated by the '|' character.

To stick to the basics, you can use just about any character but the '|' and '=' characters. If no '=' is found, then the name of the field is the entire field string. As soon as you put a '=' in, though, you follow these rules:

Field strings can be broken down to more options. The options are delimited by the ',' character, and each option is a pair of words separated by a '='. The left word is the name of the option, and the right word is the value.

Parameter 2

optiondescriptionallowed valuesdefault
nameThe name allocated to the field. This is displayed to the reader, so make it obvious.Anything, reallyThe entire field string
bgcolorbackground color of the table cells of that fieldany valid RGB colornone
textcolortext color for the table cellsany valid RGB colornone

An example of the test database formatted with different colours is:

<html><body>
<?
 include("../../../../programming/datatables/kverens_subdomain/datatable.functions.txt");
 datatable("test1",
   "name=name,bgcolor=#000000,textcolor=#FFFF00|name=address,bgcolor=#808080|phone number",
   "edit=no|add=no|delete=no");
?>
</body></html>

An example of the above can be found here.

..and an editable example of the above can be found here.

The inline styling options of parameter 2 may be dropped, as CSS is a cleaner method to do it.

CSS

The datatable, once displayed, has these ids associated with it:

Also, there are classes created for the datatable.

With a bit of experience in CSS, you can affect the datatable's appearance without messing with the sourcecode.

Updates

Please check this page regularly, to make sure you are using the most up to dat version of the function.

2002/Aug/19

"next page" and "prev page" links given ids, so you can style them as you wish. See here for an example, or here for another, or here for yet another.

2002/Aug/15

"next page" and "prev page" links added, as well as a link back to this page, so viewers of your own datatable creations can learn how to make their own.

2002/Aug/11

Douglas has been busy again, and the datatable is now listed in reverse (newest items on top), with the add entry box on top, and with tab indexing. I was mentioning some of these, but before I had a chance to do them, he had them done! Enjoy.

2002/Aug/01

Douglas Hurst, of Hurst Consulting & Design mailed me an accessibility update to the code. Mostly, it involved inclusion of label elements, and a grouping of the form elements using fieldset and legend elements. Thanks, Douglas. The only changes I have made is to remove the word "guestbook" (this script is used for other purposes as well - an example), and the addition of a surrounding div to aid in styling using CSS.

2001/Nov/25

I added another Parameter 2 option - "type", which says whether a field is "text", "url", or "email", which affects how data is seen in non-edit mode. If it's "text", it prints out as normal. If it's "url", an HREF element is built up to point to that URL. If it's "email", another HREF is built, this time with "mailto:" prepended to the address. This added functionality does not check for errors (people not putting full HTTP addresses, for example) - if this is a problem, please mail me and I'll get down on my lazy butt and do it.

Please send any comments about these pages to kverens@contactjuggling.org