Wednesday, April 23, 2008

Cloning your Corporate UI with HTML DB - Part IV (Re-Post)

The following is a re-post of the "Cloning your Corporate UI with HTML DB" series that I blogged about back in 2005 on the now-defunct Orablogs site. Most of the content and advise is still the same today, and has been reposted here exactly as it was on the old site.

June 14, 2005
In the last installment, the converted site looked pretty good, but the tabs were not quite working. The issue here was overlapping FORMs. If you look at the HTML source of the OTN Home Page, there's an HTML Form which processes the "Search" function. This form was overlapping with HTML DB's Form; thus generating an error when a tab was clicked - which essentially does an HTML POST via a JavaScript function.

In HTML DB Templates, two commonly used tokens are #FORM_OPEN# and #FORM_CLOSE#. These tokens are used where you want to open & close the "functioning" portion of an HTML DB Page. When an HTML DB page is rendered, the #FORM_OPEN# & #FORM_CLOSE# tags are substituted with some dynamic values, as outlined below:

<form action = "wwv_flow.accept" method = "post" name = "wwv_flow" id = "wwvFlowForm">
<input type = "hidden" name = "p_flow_id" value = "20530" id = "pFlowId" />
<input type = "hidden" name = "p_flow_step_id" value = "2" id = "pFlowStepId" />
<input type = "hidden" name = "p_instance" value = "2734685902684999721" id = "pInstance" />
<input type = "hidden" name = "p_page_submission_id" value = "21133974" id = "pPageSubmissionId" />
<input type = "hidden" name = "p_request" value = "" id = "pRequest" /> </ table>

<input type = "hidden" name = "p_md5_checksum" value = "" />

The real beauty of these two tags is that you don't need to know what any of the above HTML really does. It's simply enough to include them in your HTML DB templates, and they will just work. That is, of course, if you don't have overlapping FORM tags...

Back to our page in question. By moving the #FORM_OPEN# token to after the HTML which closes the FORM for the Search box, the page will now work. This presents a bit of a design challenge now. In the current version of HTML DB Studio, there is a Search field which only searches content in HTML DB Studio, not the rest of OTN. I'll have to think about whether I want to have a) two search boxes b) an OTN Only search box c) an HTML DB Studio Only search box or d) no search boxes. Technically, any of these four options are possible. It's just a matter of design choice.

That's all for now - sorry that this has been the shortest entry, but I've been taking a class all week, and evenings have been spent catching up on e-mails, etc. Add to the mix that my wife sprained her ankle today and is not supposed to walk on it, and I am all of a sudden quite busy tonight!

No comments: