Dynamic Fields Javascript

Javascripts > Javascript Forms > Dynamic Fields

Script Title: Dynamic Fields

Description: The script generates a new feild in your form if you want to add more details. It is 100% client side and it uses a pair of cookies to retain its values across calls. The name of the feild goes like field1, field2 etc and can be used to pass values to the web server.I think this will be useful for data like academic qualifications.

Example: Available

Copy the following code into your <HEAD></HEAD> tags.

<script language="JavaScript"> var cook = document.cookie; var start = cook.indexOf("choice="); var end = cook.indexOf(";",start); var x; var y; var mo; var mm; mm = 0; if (end == -1) { document.write("<body link=green alink=green vlink=green onMouseDown = \"prevent()\" >"); document.write("<table bgcolor=black border=0><tr><td ><font face='Times New Roman' color=red size=4><b>Dynamic Fields</b></font></td></tr></table><br>"); document.write("<form name=form1 >"); document.write("<input type=text name=field1 style=\"background-color:black;color:lime;width=120;height=20\" onChange=setcookf(1) onMouseOver = \"setmm()\" onMouseOut= \"freemm()\" ><br>"); document.write("</form>"); document.write("<input type=button value= \"Add more Details \" style=\"background-color:black;color:lime;width:120 \" onClick=\"setcook()\" onMouseOver = \"setmm()\" onMouseOut= \"freemm()\" onFocus=\" blur()\" > "); document.write("</body>"); } else { var fox = (end -start); fox =(( fox*1)-7); var endx = ((end*1)-1); y = document.cookie.substr(endx,fox); y = (y*1); document.write("<body link=green alink=green vlink=green onMouseDown = \"prevent()\">"); document.write("<table bgcolor=black border=0><tr><td ><font face='Times New Roman' color=red size=4><b>Dynamic Fields</b></font></td></tr></table><br>"); document.write("<form name=form1>"); mo = ((y*1)+1); var flat; if ( mo <= 10) { for (var lo=1; lo<(mo-1);lo++) { var fn = new String(); fn = "field"+lo; var flatco = ((lo*1)+1); flat = "field"+flatco; fl = fn.length; var cookf = document.cookie; var fi = new String(); fi = fn+"="; var fs = cook.indexOf(fi); var fx = ((fs*1)+fl); fx = ((fx*1)+1); var fe = cook.indexOf(";",fs); var fex ; fex = fe - fx; var fv = new String(); fv = cook.substr(fx,fex); var fc = new String(); fc = fv.substr(0,1); if (fc == "=") { fv = "- - - -"; } document.write("<input type=text name="+fn+" value=\""+fv+"\" style=\"background-color:black;color:lime;width=120;height=20\" onChange=\"setcookf("+ lo +")\" onMouseOver = \"setmm()\" onMouseOut= \"freemm()\" ><br>"); } document.write("<input type=text name=\""+ flat+"\" style=\"background-color:black;color:lime;width=120;height=20\" onChange=\"setcookf("+ lo +")\" onMouseOver = \"setmm()\" onMouseOut= \"freemm()\"><br>"); document.write("</form>"); document.write("<input type=button value=\"Add More Details\" style=\"background-color:black;color:lime;width:120 \" onClick=\"setnext()\" onMouseOver = \"setmm()\" onMouseOut= \"freemm()\" onFocus=\" blur()\" > "); } else { mo = 11; for (var lo=1; lo<(mo-1);lo++) { var fn = new String(); fn = "field"+lo; var flatco = ((lo*1)+1); flat = "field"+flatco; fl = fn.length; var cookf = document.cookie; var fi = new String(); fi = fn+"="; var fs = cook.indexOf(fi); var fx = ((fs*1)+fl); fx = ((fx*1)+1); var fe = cook.indexOf(";",fs); var fex ; fex = fe - fx; var fv = new String(); fv = cook.substr(fx,fex); var fc = new String(); fc = fv.substr(0,1); if (fc == "=") { fv = "- - - -"; } document.write("<input type=text name="+fn+" value=\""+fv+"\" style=\"background-color:black;color:lime;width=120;height=20\" onChange=\"setcookf("+ lo +")\" onMouseOver = \"setmm()\" onMouseOut= \"freemm()\" ><br>"); } document.write("</form>"); } } function setcook() { document.cookie= "choice=2;"; document.cookie = "dx=dx;"; history.go(0); } var i; function setcookf(i) { var tempv = document.form1.elements[i-1].value ; var lentemp = tempv.length; var tempn = document.form1.elements[i-1].name ; document.cookie = tempn+"="+tempv+";" ; } function setnext() { document.cookie = "choice="+((y*1)+1)+";"; document.cookie = "d"+mo+"=v;"; history.go(0); } function setmm() { mm = 1; } function freemm() { mm = 0; } function prevent() { if (mm == 0) { alert ('JavaScript Prevents the Action'); } } </script>

Enter your name and email address to have this script sent right to your Inbox for later viewing.

First Name Last Name Email

Graphxkingdom
Thousands of free Icons, Clipart & Themes!

Free-Backgrounds
Hundreds of eye-popping Backgrounds & Textures

Java-scripts.net
Cool and easy effects with cut-and-paste Javascripts!