Nested forms

Can someone please point me in the right direction on what to do here,
in terms of basic architecture. I;ve seen this type of interface
before.

Let’s say I have something that is “sold” and I have a form for the
sold information. At the bottom of the form, say, us a little “plus
sign” or something like that, with a notation after it that says
“Customer”, which then opens up another form, embedded in the sold
form (in terms of the UI) to enter possible customer information for a
second form, and that customer form may have another form embedded in
it with a plus sign, etc. When I submit on an embedded form, it
closes, taking me to its enclosing form, with a plus sign where the
one I just submitted was.

The basic idea therefore is to

  1. conserve screen space
  2. not require you to redirect to another page for a form which is
    linked to by it;s enclosing form

Is there a standard library for this type of thing? (Im open to any
ideas that satisfy these two points mentioned) If not, can you tell me
how to create it? Thanks, Janna B

On Sat, 2009-07-11 at 17:55 -0700, JannaB wrote:

Can someone please point me in the right direction on what to do here,
in terms of basic architecture. I;ve seen this type of interface
before.

The short answer is that you cannot nest forms structurally. The
standard prohibits. What you can do, and is easy to do if you learn a
little CSS, is to nest them visually. Those are two completely separate
issues.

Best reagards,
Bill

Hello–

On Jul 11, 2009, at 5:55 PM, JannaB wrote:

second form, and that customer form may have another form embedded in
ideas that satisfy these two points mentioned) If not, can you tell me
how to create it? Thanks, Janna B

Im ok with the controller / model architecture…it;s the UI itself
that I am trying to accomplish. Simply, a means to collapse forms on
the screen is reallyt what I want. Thanks! Janna

http://www.prototypejs.org/api/element/toggle

$(‘your-sub-form’).toggle()

will hide or show a given element. Just wrap your subform in a div
with a unique id and put a disclose link outside that div. You can
then use an onclick handler for that disclose link if you like the
inline JS route or by defining the behavior of the element in the
document.observe(''dom:loaded", …) function.

hth