htmlformspage-layout

how to combine html forms


How would i combined 2 html forms

I am trying to combined to forms that are in different position. so i can post all the data at once.

Here is a eg

<form action="actions.php">
<input type="text">
<input type="text">
 <input type="submit" name="button" id="button" value="submit" />

</form> 


<form>
<input type="text">
<input type="text">
 </form> 

Solution

  • Do NOT make 2 forms. Use proper HTML elements and CSS for layout. Feel free to use javascript to animate and add effects as needed.

    By proper elements I mean you could do something like:

    <form action="actions.php">
        <fieldset id="personalInfo">
            <legend>Personal Information:</legend>
            <input type="text" name="field1" />
            <input type="text" name="field2" />
            <input type="submit" name="button" id="button" value="submit" />
        </fieldset>
    
        <fieldset id="addressInfo">
            <legend>Address information:</legend>
            <input type="text" name="field3" />
            <input type="text" name="field4" />
        </fieldset>
    </form>
    

    And use CSS to place them.

    #personalInfo {position: relative; top: 0px}
    #addressInfo {position: relative; top: 200px;}
    

    Of course, adapt the example to your needs.