Let's now go to the details page. We still don't have much in the way of details, but let's see what we can do. Also, we can use the edit-details as our initial page -later on we can quite easily refactor it to a mere view details record, if we want to. We must also make sure that the ean13 is not changeable here, because it serves as our unique key. Likewise we may want to get back to the list from the item view, so let's provide ourselves a link for that, what follows is a very simple view.
This view is different because it has a form on it - so we want to be able to develop the form. Because forms have to handle stuff - we can deal with that by using formlets - little bits of form normally made up one input or a few closely knitted inputs. So each formlet will have a placeholder on this page. I have chosen to use labels for that.
We also need somewhere for putting up messages - eg errors - from bad form submissions. dvditem.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>My DVD Library Item-View</title>
</head>
<body>
<div><a href="dvdlist.obyx">Back to list</a></div>
<form method="post" action="dvditem.obyx" enctype="multipart/form-data" >
<fieldset>
<label id="ean13" />
<label id="title" />
<input type="submit" value="Update" />
</fieldset>
</form>
<div id="form_status"><!-- hidden --></div>
</body>
</html>
To handle the item view, the obyx file will load it, and then call the formlet handlers, with addresses for putting their results into the main view. The formlet handlers are function files - so we can pass the parameters we need to them.
Creating the dvditem.obyx file
<instruction xmlns="http://www.obyx.org">
<input>
<instruction note="declare namespace hook h for xhtml">
<output space="namespace" value="h"/>
<input value="http://www.w3.org/1999/xhtml"/>
</instruction>
<instruction note="load item page view">
<output space="store" value="view"/>
<input space="file" value="dvditem.html"/>
</instruction>
<instruction operation="function" note="ean13 formlet">
<input space="file" value="dvdformlet_ean13.obyx"/>
<input name="xpath" value="view!#//h:label[@id='ean13']"/>
<input name="errxp" value="view!#//h:div[@id='form_status']/child-gap()"/>
</instruction>
<instruction operation="function" note="title formlet">
<input space="file" value="dvdformlet_title.obyx"/>
<input name="xpath" value="view!#//h:label[@id='title']"/>
<input name="errxp" value="view!#//h:div[@id='form_status']/child-gap()"/>
</instruction>
<instruction note="display view">
<input space="store" value="view" release="true"/>
</instruction>
</input>
</instruction>
Formlets normally need a little bit more - but for the time being, lets keep it simple. The first formlet is for the ean13 value.
If we look at the model, the ean13 value is our unique key - and it may be present regardless of whether or not the form has been updated. So - what we need to do is to check for it's presence, and if it's found, then to check the database. If it is found in the database, then we want to lock this input - we are editing the record found at this key after all. If there is no ean, then that means that this is being used as a new record, and we don't need to do much at all.
Later on we will add proper validation to the file - but we don't really need to worry about that now! Let's handle the view first - this is a pretty straightforward input.
We need to create a file called dvdformlet_ean13.html
<!DOCTYPE label PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<label xmlns="http://www.w3.org/1999/xhtml">
<span>EAN-13</span>
<input name="ean13" type="text" />
</label>
And then create: dvdformlet_ean13.obyx
<instruction xmlns="http://www.obyx.org">
<input>
<instruction note="load formlet view">
<output space="store" value="f_ean13"/>
<input space="file" value="dvdformlet_ean13.html"/>
</instruction>
<comparison operation="existent">
<comparate space="sysparm" value="ean13" />
<ontrue>
<iteration operation="sql" note="check for presence on db" >
<control kind="text">
<s value="select ean13,title from ean13item where ean13='" />
<s space="sysparm" value="ean13" encoder="digits" />
<s value="'" />
</control>
<body>
<instruction note="add lock">
<output space="store" value="f_ean13#//h:input/@readonly"/>
<input value="readonly" />
</instruction>
</body>
</iteration>
<instruction note="insert value">
<output space="store" value="f_ean13#//h:input/@value" />
<input space="sysparm" value="ean13" encoder="digits" />
</instruction>
</ontrue>
</comparison>
<instruction note="display view to parent">
<output space="store" context="parm" value="xpath" />
<input space="store" value="f_ean13" release="true"/>
</instruction>
</input>
</instruction>Click the link below to go to the next part of our tutorial