How to remember input form values?

Question

Hi,

I am trying to create 2 forms, which the user can select by clicking form1 and formt2.

When the user select between form1 and form2. I want form2 to remember the value of form1 and pass on the value of the selected form for submission

How can this be done in the most simplest way?

Thanks

Answer 1

How about using the same inputs for similar entries?

You can use CSS classes to hide elements/labels that you don't want to see.

<script type="text/javascript">
$(document).ready(function() {
    $('.form-select').change(function() {
        // changes the class of our form
        var setClass = "mode" + $('input[name=whichForm]:radio:checked').val();
        $('#theForm').attr('class',setClass);
    });
});
</script>

<style type="text/css">
    #theForm fieldset { display: inline; }       // just a visual preference
    #theForm .business { color: blue; }          // color-coding
    #theForm .personal { color: green; }         // more color-coding
    #theForm.mode1 .business { display: none; }  // hides .business items when not needed
    #theForm.mode2 .personal { display: none; }  // hides .personal items when not needed
</style>

<form id="theForm" class="mode3" action="take-form.php">
    <fieldset>
        <legend> Information </legend>
        <input type="radio" id="whichForm-1" class="form-select" name="whichForm" value="1"><label for="whichForm-1">Personal</label>
        <input type="radio" id="whichForm-2" class="form-select" name="whichForm" value="2"><label for="whichForm-2">Business</label>
        <input type="radio" id="whichForm-3" class="form-select" name="whichForm" value="3"><label for="whichForm-3">Show All (Debug)</label>
        <hr>
        <input type="text" id="name" name="name">
        <label for="name">
                <span class="personal">Your</span>
                <span class="business">Business</span>
                <span> Name</span>
        </label>
        <br>
        <input type="text" id="address" name="address">
        <label for="address">
            <span class="personal">Home</span>
            <span class="business">Office</span>
            <span> Address</span>
        </label>
    </fieldset>
</form>