Link to home
Start Free TrialLog in
Avatar of csindorf
csindorf

asked on

long form

I have a full 2 page printed form that I need to put on the web.  The problem is that it will end up being 6 to 9 pages long if you scroll down.  So what I am looking to do is keep it as tight as possable.  Some of the items all users might not use and some all will use.  So what might be the easiest way to keep the main form as short as I can then if the user has data for an area they can click on that link to add that data.  Then when they are done with the entire form the user presses submit and off they all go as one complete form.

TIA
Craig  
Avatar of rafistern
rafistern

The approach will depend somewhat on what browsers you are supporting. If you are supporting a wide range of browsers then have buttons (or track text field contents etc) using javascript to open windows with the extra bits of form in them. If you are only supporting IE/NS4+ then you can use DHTML to popup or add in the extra bits of form when a button is clicked or fields are fillled in or radio buttons selected.

Alternatively you could have a form where you preselect the parts of the main form that you are going to use (a la wizard) and use either javascript (client side) or cgi/asp (server side) to custom compile the form.

Let me know more and I'll see how I can help.
Avatar of csindorf

ASKER

The big thing is browser independance !  So I like the javascript and window thing as long as the code is short and sweet.  But then will all the other windows be considered the one main form ?  It needs to be one form when submitted to the cgi script that is in place.  

TIA
Craig
Another solution is to store the parts of the form that have
already been filled out in hidden fields.
You create, say, 6 different forms (pages), accessible
from the main form. Each one has a submit button.

After submitting a subform, the CGI program returns the
main form again, with the filled-in values stored as hidden
fields.
Finally, there is a submit button on the main form that
the user can click when he/she is finished.

You can use the same CGI program, just use different
values for the submit button to recognize which subform
the user is on.

Completely browser independant, no javascript, but
slightly more difficult on the server side.

pluim.
ASKER CERTIFIED SOLUTION
Avatar of rafistern
rafistern

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
It works great.  How could I change from using a button to a text link?  Some places a button fits in right and others a text link would be best.
In place of:

<input type=button onclick='sf1_show()' value='click'>

use:

<a href="javascript:sf1_show()">get some more form</a>

Outstanding, thanks a heap
rafistern did I forget to click on the grade ???????
You did grade me. No problem. Thanks for the points :-)
Would it be possable to put the code on 2 or 3 other forms then have them send back to the hidden boxes on the main form.  Resend so you get the points and I will add points to it.  I would like to use a bit of all 3 if not I will use the buttons and links.

csindorf
With the solution I gave you, you can open a series of windows - just give each one a different name (use a differently named function sf1_show(), sf2_show(), etc).

Is that what you mean?
I figured out the multiple windows thing but that is not what I am getting at.  I mean to have let's say 3 forms in all form1, form2, and form3.  Form1 will be the main form that will submit to the cgi.  The other 2 will send back info to form1 and its hidden boxes.  But all 3 can have pop ups like we have done.  Is that better ?
You mean like popups inside popups? I suppose you could.

Your function sf1_show() would now look like this:

<script language=javascript>
  function sf1_show(){
    show(""+
    "<input type=text name='field'>"+
    "<input type=text name='field1'>"+
    "<input type=text name='field2'>"+
    "and some text<br>"+
    "&lt;script&gt;"+
    "  function sf1_show(){ "+
    "    show(''+ "+
    "    '<input type=text name=\"field\">'+ "+
    "    '<input type=text name=\"field1\">'+ "+
    "    '<input type=text name=\"field2\">'+ "+
    "    '');"+
    "&lt;/script&gt;"+
    "");
}
</script>

and show() would look something like:

function show(theText){
  z=open("","zz",width=300,height=200);
  z.document.open();
  z.document.write("<head>"+
"&lt;script language=javascript&gt;"+
"function show(theText){"+
"za=open('','zza',width=300,height=200); "+
"za.document.open(); "+
"za.document.write('<form>'+theText+'<input type=button "value=\"close\" onclick=\"opener.writeFields(window)\"></form>'); "+
"z.document.close(); "+
"} "+
""+
"function writeFields(win){ "+
"for(i=0;i<win.document.forms[0].elements.length;i++){ "+
"for(j=0;j<document.forms[0].elements.length;j++){ "+
"if(win.document.forms[0].elements[i].name==document.forms[0].elements[j].name){ "+
"document.forms[0].elements[j].value=win.document.forms[0].elements[i].value "+
"} "+
"} "+
"} "+
"win.close(); "+
"} "+
"&lt;/script> "+
"&lt;/head> ");
  z.document.write("<form>"+theText+"<input type=button value='close' onclick='opener.writeFields(window)'></form>");
  z.document.close();
}


or something like that. This is getting very complicated. I am going home very soon, so I'm sorry I can't give you any more time today. Try it out - it should work.
No not pop ups inside of pop up but a link that would actually call another form on the site.
..and then have two windows open passing data from one to the other? I suppose you could but it sounds rather confusing to me.

Parent window
child window win1
child window win2

from win1 to win2 call parent.win2.document.forms[0] etc...
No there will only be one open window at a time but all windows will pass to form1
That is a server side problem. I suggest you submit a question to cgi area about how to do it. What scripting language do you have server-side?
Never mind that, I found a work araound.  But one problem I did have is with the windows size in your code:
z=open("","zz",width=300,height=200);
It opens a window to the size of the browser windows.  According to your code shouldn't it be 300 x 200 in size ?

TIA
Craig
Put the width=300,height=200 in "quotes". Sorry.
That did it, thanks.  What are the first 2 parameters for ?

"" =
"zz"=

z=open("","zz","width=300,height=200");
never mind I found them in my book.  Thanks a heap