Question

I’ve got an assignment to pass data between 2 .htm pages, in a manner which the source gets copied to the destination.

sourcePage.htm contains a form. (it contains more controls this is just a sample)

<form id="myform" action="destPage.htm" method="get" >
    <input type="text" name="user" />        
    <input type="submit" name="submit" value="Submit" />        
</form>

and destPage.htm is blank.

Using JavaScript I am required to parse the data from the url, that part isn’t the problem
, the problem is that I am also required that destPage would be an exact duplicate of sourcePage.

My question is, if there’s a way to pass the form as an object or some way to pass the control types and their properties along side the data.

Answer 1

You specified in the answer of ek_ny, that you want to dynamically build the form, based on it’s input.

You can do this, in fact, with the JavaScript DOM:

var i = document.createElement('input');
i.setAttribute('type', "text");
i.setAttribute('name', "user");

var f = document.createElement('form');
f.setAttribute('action', "destpage.html");
// etc.

f.appendChild(i);

document.getElementById('container').appendChild(f);

The form will be added as a child in the <div id="container"> container.

Now you can use hidden input elements, which give, for instance, the specifics of the form:

<form>
    <input type="hidden" name="x_type" value="input-text" />
    <input name="x" type="text" />

    <input type="hidden" name="y_type" value="select:[...]" />
    <select name="y">
        ...
    </select>
</form>