YOUR FEEDBACK
Kirstan Vandersluis wrote: Great intro to SOA, Paul. You mention in the summary that budget cuts may stifl...
Cloud Computing Conference
March 30 - April 1, New York
Register Today and SAVE !..

2008 East
DIAMOND SPONSOR:
Data Direct
Frontiers in Data Access: The Coming Wave in Data Services
PLATINUM SPONSORS:
Red Hat
The Opening of Virtualization
Intel
Virtualization – Path to Predictive Enterprise
Green Hills
IT Security in a Hostile World
JBoss / freedom oss
Practical SOA Approach
GOLD SPONSORS:
Software AG
The Art & Science of SOA: How Governance Enables Adoption
PlateSpin
Effective Planning for Virtual Infrastructure Growth
Fujitsu
Automated Business Process Discovery & Virtualization Service
Ceedo
Workspace Virtualization
Click For 2007 West
Event Webcasts

2008 East
PLATINUM SPONSORS:
Appcelerator
Think Fast: Accelerate AJAX Development with Appcelerator
GOLD SPONSORS:
DreamFace Interactive
The Ultimate Framework for Creating Personalized Web 2.0 Mashups
ICEsoft
AJAX and Social Computing for the Enterprise
Kaazing
Enterprise Comet: Real–Time, Real–Time, or Real–Time Web 2.0?
Nexaweb
Now Playing: Desktop Apps in the Browser!
Sun
jMaki as an AJAX Mashup Framework
POWER PANELS:
The Business Value
of RIAs
What Lies Beyond AJAX?
KEYNOTES:
Douglas Crockford
Can We Fix the Web?
Anthony Franco
2008: The Year of the RIA
Click For 2007 Event Webcasts

SYS-CON.TV
TOP THREE LINKS YOU MUST CLICK ON


Creating a Database Using HTML Forms
Getting Started with Smans HTML form

This article is aimed at beginner and intermediate Web developers looking to make the leap into database support of their Web site. The article suggests a new declarative language based on HTML-forms, which is used for development of a database interface. HTML forms can manage not only the creation of a database, but also the execution of requests to the database.

This article explains an original approach based on the features of the open source Smans server.

Creating a database by means of HTML forms

As we know, HTML form is a block of HTML page allowing to enter data from the Web browser on a local or remote Web server. The form block is marked with tags <form ...> and </form>. Fields inside of HTML forms may have different types, for example a list or a text field. The Listing 1 specifies code of a form example and Fig. 1 shows view of that form in Web browser.

 

Listing 1. HTML form code

<form method="post" action="...">
A: <input type="text" name="A" size="10" value="a"/><br />
B: <select name="B" multiple="multiple">
<option value="b1" selected="selected">b1</option>
<option value="b2">b2</option>
</select><br />
C: <input type="radio" name="C" checked="checked" value="c1" />c1
<input type="radio" name="C" value="c2" />c2<br />
D: <input type="checkbox" name="D" checked="checked" value="d1" />d1
<input type="checkbox" name="D" value="d2" />d2<br />
<input type="submit" value="Submit" />
<input type="reset" value="Reset" />
</form>

Fig 1. HTML form view

A:
B:
C: c1 c2
D: d1 d2

The HTML form is used usually to enter only one record in the table of a database. Each name attribute defines the name of the respective form field and input record. Simultaneously, for Smans server, the same name is considered as a name of a column in the corresponding table. The additional information, usually invisible to the user, is transmitted to the Smans server due to managing fields of HTML form. Most important managing field is $Table. The action attribute in the form descriptor sets up /servlet/record servlet name, receiving and processing the HTML form with operating fields. For example:

<form action="../servlet/record" method="post">
<input type="hidden" name="$Table" value="Order" />
...
</form>

The $Table field designates a table formed in the database. Let's consider the example of the recording HTML form making Order table in Listing 2 and Fig. 2.

Listing 2. Code of recording HTML form

<form action="../servlet/record" method="post">
<input type="hidden" name="$Table" value="Order" />
Date: <input type="text" name="Date" /><br />
Name: <input type="text" name="Name" /><br />
Phone: <input type="text" name="Phone" /><br />
Company: <input type="text" name="Company" /><br />
Product Type: <input type="text" name="Product Type" /><br />
Product Name: <input type="text" name="Product Name" /><br />
Quantity: <input type="text" name="Quantity" /><br />
<input type="submit" value="Submit Data">
<input type="reset" value="Reset Form">
</form>

Fig 2. View of recording HTML form

Date:
Name:
Phone:
Company:
Product Type:
Product Name:
Quantity:

Each input record has to have primary key field(s). In this case, Order table will have Order key column. Because Order field is missing in HTML form, a value of Order primary key field is generated automatically by Smans server as number of table record (row) in increasing order. If Order table in a database still is not present, it will be created. In case the table already exists with other columns, the new columns will be added. As a result, the table will have at least the following list of columns:

Order 
Date
Name
Phone
Company
Product Type
Product Name
Quantity

For the event of successful record, you can easily set up the message or the subsequent actions by means of the $Forward field. For example:

<input type="hidden" name="$Forward" value="Confirm.html" />

All the managing fields sets up managing HTTP request parameters. In addition to the mentioned above, there are $PKey parameters. They are useful if the table has several primary key columns, when it is necessary to prevent the reoccurrence of several column values. Each $PKey parameter points to the name of conventional parameter (field) in the HTML form, for example:

<form action="../servlet/record" method="post">
<input type="hidden" name="$Table" value="Product">
<input type="hidden" name="$PKey" value="Product Type" />
<input type="hidden" name="$PKey" value="Product Name" />
<input type="text" name="Product Type" />
<input type="text" name="Product Name" />
...

There are corresponding examples in the distribution kit of the Smans server. They are in a hforms directory. The simplest examples are realized in <wapp>/hforms/Order.html and <wapp>/hforms/Product.html HTML pages. Check up an example. The http://<domain>[/<application>]/hforms/Order.html is address of Order.html page from a Web browser. When you enter the record, the Smans server gives you a message, by default:

Data recorded. Thanks! 
Please return back and continue.

Dialogue scenario through HTML forms

It is a normal situation when the page image depends on certain input parameters processed through PHP, JSP or ASP. Such parameters can be type of a Web browser, human language, personal data of the user or his interests, etc. The part of parameters is defined from the initial user request. The part of parameters undertakes from cookies, kept in a client computer in the previous sessions. Other part is established during dialogue.

Dependencies of some parameters on the other are data that are easier to store separately in the database than alternately inside of operating scripts or programs having a lot of other directives. Importance of such approach is not only in plain presentation. The database system allows to find easily the necessary groups of parameters and dependences by inquiry. In addition, the developer has an opportunity easily to change values of parameters and their dependences, and therefore a particular scenario dialogue, not touching the relevant scripts or programs.

Let's consider a common situation involving a different resource provision to different users. The necessary dependences and a corresponding database can be generated during registration of the user. In my example, Listing 3, such resources are news. The $Table managing field specifies Username key field, beside the table. The user selects interesting news, which are in the ExpectedNews field. Dependence Username-ExpectedNews is kept in a database of schema Username(Password, ExpectedNews).

Listing 3. Recording HTML form. User registration.

<form name="form1" action="../servlet/record" method="post">
<input type="hidden" name="$Table" value="Username" />
<input type="hidden" name="$Forward" value="hforms/Login.html" />
Username: <input type="text" name="Username" /> <br/>
Password: <input type="password" name="Password" /> <br/>
Expected News:
<select name="ExpectedNews" multiple="multiple" size=5>
<option value="Sport">Sport</option>
<option value="HiTech">Hi Tech</option>
<option value="Policy">Policy</option>
<option value="Economy">Economy</option>
<option value="Financies">Financies</option>
</select> <br/>
<input type="submit" value="Register">
</form>

If registration is successful, next control is passed to the hforms/Login.html page by $Forward. This login page has managing recalling HTML form. Look at Listing 4. The value ../servlet/recall is Smans' servlet, processing the form fields. The $Param fields specify the parameters transferred to an Internet resource pointed in $Forward. The values of $Param parameters are selected from a database in accordance with dependencies: {input data} -> $Table -> {$Param, ...}.

Listing 4. Calling HTML form. User login.

<form name="form1" action="../servlet/recall" method="post">
<input type="hidden" name="$Table" value="Username" />
<input type="hidden" name="$Forward" value="hforms/News.jsp" />
<input type="hidden" name="$Param" value="Username" />
<input type="hidden" name="$Param" value="ExpectedNews" />
Username: <input type="text" name="Username" /><br/>
Password: <input type="password" name="Password" /><br/>
<input type="submit" value="Login">
</form>

Logic of calling HTML form for each $Param can be seen in SQL as:

 SELECT $Param FROM $Table WHERE {input data}

Then all the found parameters will be transferred by $Forward address (URL), in my case to hforms/News.jsp, like hforms/News.jsp?Username=...&ExpectedNews=...&ExpectedNews=... . Beside JSP, any other resource could as value of $Forward, such as PHP server page, servlet, Perl script and so on. Possible fragment of JSP is figured in Listing 5.

Listing 5. JSP fragment. Server response.

<%
String username = request.getParameter("Username");
String enews[] = request.getParameterValues("ExpectedNews");
%>
Dear <%= username %>,<br/>
This simple demo is regarding the work with html form control.<br/>
<h1>Your Favorite News</h1>
<%
if (enews != null) {
for (int i = 0; i < enews.length; ++i) {
...
}
}
%>

The example described in this section, is realized with Register.html, Login.html, and News.jsp files within hforms directory of free and open source Smans server.

Conclusion

My task was to show how you can quickly and easily develop a dynamic Web site without knowing SQL and without being a DBMS expert. Considered tools are quite enough to design the big branchy dialogue, when each previous calling HTML form forwards parameters to JSP/PHP/ASP page, which in its turn may contains a next calling HTML form, and so on. It is important to remember that hidden fields inside of HTML forms cannot be really hidden from the user. Nevertheless, Smans data are quite protected. Tables are created and used only from those HTML pages which are located inside of Web application working with Smans.

Smans HTML forms represent a declarative language inside of existing HTML. Advantages of Smans HTML forms are defined by features of a database with which server Smans works and first of all by flexibility of this database and opportunity to enter data in advance not defining the database schema.

 

About Sergey Savushkin
Sergey Savushkin has long experience in the development of database system, Sav Zigzag ORDBMS. The Smans project can be found here

LATEST OPEN WEB DEVELOPER STORIES
The job of running Microsoft’s flagging Google counter-offensive – which has lain like a fallow field since Kevin Johnson left the company in July to become CEO of Juniper Networks, having been foiled in buying Yahoo – has been filled. As widely suspected lately, Microsoft ...
Newsweek – which apparently sees the Obama cabinet amounting to a lot of big names with little experience – is floating the idea that the president-elect might make Dan Reicher, Google's director of climate change and energy initiatives, energy secretary. Reicher was assistan...
After spending a year in private beta, Amazon's SimpleDB has been pushed into what the company calls "unlimited public beta." Any developer or business can now sign up and start using the web service. As a come-on, for the next six months or so Amazon will be offering a free mont...
Good OS, who’s tight with Google and whose gOS Linux powered a $199 Everex PC that Wal-Mart sold last year, is wheeling out Cloud, a new browser operating system that reportedly boots up the Internet in seconds and can be used to toggle between Windows and a Linux OS on the sam...
W3C has got a new standard to make it easier to author interactive multimedia presentations. Synchronized Multimedia Integration Language (SMIL) 3.0 lets video, audio, images, text and hypertext links be combined into interactive presentations, with fine-grain control of layout a...
In the future, you will be able to surf the Internet, hands-free, by using your voice, according to the third annual "IBM Next Five in Five" - a list of innovations that have the potential to change the way people work, live and play over the next five years. The list predicts th...
SUBSCRIBE TO THE WORLD'S MOST POWERFUL NEWSLETTERS
SUBSCRIBE TO OUR RSS FEEDS & GET YOUR SYS-CON NEWS LIVE!
Click to Add our RSS Feeds to the Service of Your Choice:
Google Reader or Homepage Add to My Yahoo! Subscribe with Bloglines Subscribe in NewsGator Online
myFeedster Add to My AOL Subscribe in Rojo Add 'Hugg' to Newsburst from CNET News.com Kinja Digest View Additional SYS-CON Feeds
Publish Your Article! Please send it to editorial(at)sys-con.com!

Advertise on this site! Contact advertising(at)sys-con.com! 201 802-3021


SYS-CON FEATURED WHITEPAPERS

ADS BY GOOGLE
BREAKING OPEN WEB DEVELOPER NEWS
CAMBRIDGE, Mass., Dec. 3 /PRNewswire/ - Vlingo(TM) Corporation today announced availability of its v...