dominoGuru.com
Your Development & Design Resource
Using the HTML Body Attributes to manipulate Domino-generated Web/Mobile client Design Elements
01/30/2008 01:21 PM by Chris Toohey
Authors Note: Sure, it's a hack - but it's pretty slick! ;-)
While I tend to roll my own Web and Mobile client Design Elements and not let Domino generate any of that RAD web element publishing stuff... but stuff like this is good to know!
Jake shared a method to embed a Login Form across your forms/elements/etc. A good tip, but
relies on the </form>-in-the-header approach to kill the Domino-generated
<form>
instance so you can actually do what you want (the
quick & watered-down version of Content Type overrides and
building your own forms outright... but I digress)
What if you don't want to kill the Domino-generated
<form>
? Well, here's an option for you!
Let's say you want to put some markup between the
<body>
and the Domino-generated <form>
elements. How can I do such a thing you ask?! Well, check this out:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript" type="text/javascript">
<!--
document._domino_target = "_self";
function _doClick(v, o, t, h) {
var form = document._test_bodyattributes;
if (form.onsubmit) {
var retVal = form.onsubmit();
if (typeof retVal == "boolean" && retVal == false)
return false;
}
var target = document._domino_target;
if (o.href != null) {
if (o.target != null)
target = o.target;
} else {
if (t != null)
target = t;
}
form.target = target;
form.__Click.value = v;
if (h != null)
form.action += h;
form.submit();
return false;
}
// -->
</script>
</head>
<body text="#000000" bgcolor="#FFFFFF" ><div
id="popup"> </div>
<form method="post"
action="/DrawingBoard.nsf/test_bodyattributes?OpenForm&Seq=1"
name="_test_bodyattributes">
<input type="hidden" name="__Click" value="0">Test</form>
</body>
</html>
All I did to generate the above.... markup <shudder> was to modify the
HTML Body Attributes, add a closing > to complete the
<body>
element, and add a div
element named
popup.
{><div id="popup"> </div}
As you can see, I close the <body>
element first, but
leave the <div>
element open-ended. The HTML Body
Attributes will force a closing tag (>), which while intended to close
the <body>
element I'll be more than happy
to use to close my <div>
element!
Now, as I mention in my comments on Jake's post, I typically have a
div
called popup that I use AJAX (or the ol'
iframe
-hack) to populate with functional content - such as a form
that, upon submission, populates certain "locked" fields on the main form.
Think about a name picker widget or something like that to get an idea of what
I'm talking about here.
Since this popup div
sits above/outside of the main
<form>
element, I don't have to worry about nested forms and
can do pretty much whatever I want!
... but I'll stick to rolling my own thank-you!