Skip to main content

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_OPEN#
<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>

#FORM_CLOSE#
<input type = "hidden" name = "p_md5_checksum" value = "" />
</form>

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!

Comments

Popular posts from this blog

Custom Export to CSV

It's been a while since I've updated my blog. I've been quite busy lately, and just have not had the time that I used to. We're expecting our 1st child in just a few short weeks now, so most of my free time has been spent learning Lamaze breathing, making the weekly run to Babies R Us, and relocating my office from the larger room upstairs to the smaller one downstairs - which I do happen to like MUCH more than I had anticipated. I have everything I need within a short walk - a bathroom, beer fridge, and 52" HD TV. I only need to go upstairs to eat and sleep now, but alas, this will all change soon... Recently, I was asked if you could change the way Export to CSV in ApEx works. The short answer is, of course, no. But it's not too difficult to "roll your own" CSV export procedure. Why would you want to do this? Well, the customer's requirement was to manipulate some data when the Export link was clicked, and then export it to CSV in a forma...

Manipulating Images with the... Database?

A recent thread on the OTN HTML DB Forum asked about how to determine the width & height of an image stored as a BLOB in an Oracle table. I mentioned in that thread that I have some code to manipulate an image stored in a BLOB column. This is particularly useful if you’re going to let users upload images, and you want to re-size them to display as a thumbnail. Thanks to Oracle interMedia , it is trivial to manipulate the width, height, and other attributes of images stored in an Oracle table. I’ve created a sample application here which demonstrates Oracle interMedia and HTML DB in action. Feel free to have a look. You can download this application from HTML DB Studio as well. Basically, this application allows you to upload images and perform an operation on the image as it is inserted into the PHOTO_CATALOG table. There are two places where some PL/SQL code is required: an After Submit process on page 2, and a procedure to display the images. Here is the PL/SQL for the After...

Refreshing PL/SQL Regions in APEX

If you've been using APEX long enough, you've probably used a PL/SQL Region to render some sort of HTML that the APEX built-in components simply can't handle. Perhaps a complex chart or region that has a lot of custom content and/or layout. While best practices may be to use an APEX component, or if not, build a plugin, we all know that sometimes reality doesn't give us that kind of time or flexibility. While the PL/SQL Region is quite powerful, it still lacks a key feature: the ability to be refreshed by a Dynamic Action. This is true even in APEX 5. Fortunately, there's a simple workaround that only requires a small change to your code: change your procedure to a function and call it from a Classic Report region. In changing your procedure to a function, you'll likely only need to make one type of change: converting and htp.prn calls to instead populate and return a variable at the end of the function. Most, if not all of the rest of the code can rem...