Forms within forms?

Discussion in 'Web Design and Development' started by Mitthrawnuruodo, May 23, 2007.

  1. Mitthrawnuruodo Moderator emeritus


    Mar 10, 2004
    Bergen, Norway
    I have a client who wants me to make a few corrections - some large some small - on their website. One of the small jobs, or so I thought, was to clean up a combined registration/login page, which now has two forms, the login form above the registration form.

    Now, the client has made a very specific direction on how he wants the page (which is built up with a table layout, which I'm hesitant to touch at this point), very much like this:
    | Registration form |
    | ...               |
    |         ----------|
    |         | login  ||
    |         | form   ||
    |         | ...    ||
    |         ----------|
    | o lorem ipsum     |
    But, since there's a couple of check boxes from the registration form at the bottom of the page, I then have to nest the login form within the registration form, and - as far as I know - that will not work as intended, and the test I've done seem to confirm this...

    So, questions (if answer is 'no', move on to next question ;)):

    - Is there a way to make "nested" forms, at all?

    - Any bright ideas on (simple) workarounds?

    - Any ideas on workarounds, possible involving divs instead of the (outer) table?

    - Or is the best way just to move the frelling login form or check-boxes?

    This conundrum is forcing me to get a third cup of coffee this morning, and I usually stop at two, even after an allnighter... :eek:
  2. dcv macrumors G3

    May 24, 2005
    Off the top of my head... use iframes?? It's been a while since I've coded anything like that but if I think of anything useful I'll let you know!
  3. elppa macrumors 68040


    Nov 26, 2003
    Can't do forms in forms, won't work.

    I know the page is built with tables, but my first thought would be this:

    You could probably do something with an absolutely positioned div inside a relatively position div.

    <div style="position:relative;">
        <div style="position:absolute; top, left etc...">
            <form id="form1">
        <form id="form2">
    Obviously the style won't be inline, I've just done it like that for this example.

    I think you know far more about CSS than me (from reading other posts) so apologies if this next bit sounds condescending! Basically the inner div will take it's top / left co-ordinates from the position of the outer div.

    The problem is you have to make sure the outer div will be taller than the inner div.
  4. tschoftner macrumors member


    Apr 14, 2007
    Hi there!
    i am not sure whether this will work; but you could try and make the one more important form in a php-file and include the login-form from another php-file with "include ()" or "require_once";
    just a thought though!
    :apple: rulez!!
  5. elppa macrumors 68040


    Nov 26, 2003
    It would work, but it wouldn't solve this problem because you'd still have nested <form> tags.
  6. Winterfell macrumors regular

    Apr 3, 2007
    Tulsa, Oklahoma
    The only way I can see this working is by using CSS like elppa suggested.

    Just have the larger form (container form) on the page, and then use a floating div to position the smaller form within it. This way the form elements are not truly nested, but will give the appearance of being so.

Share This Page