Jump to content

dynamic field creation


Jocka

Recommended Posts

I'm working on a script that will let a user create up to 10 fields to put experience and years of experience in.

I ran into 2 problems with this.

1. I want to align the fields properly so it doesn't look generic. I tried using tables but the javascript wouldn't let me.
2. I need to keep information typed into any of the boxes.

here is my script:
[code]
<html>
<head>

<-script language="Javascript" type="text/javascript">
var tcount = 1;
var inhtml = '';
function tst(){
var info = document.getElementById('test');
if(tcount < 10){
if(tcount == 1){
inhtml = info.innerHTML
}
info.innerHTML += inhtml
tcount = tcount + 1
return true;
} else {
return false;
}
}

</script->

</head>
<body>

<form>
<table width="100%">
<tr>
<td width="50%"valign="top">
Experience Name | Years of Experience<br>
<div id="test" name="test">
<input type="text" name="exname" value="Experience Title.."> | <input type="text" name="exyears" value="0"><br>
</div>
</td>
<td width="50%" align="center" valign="top">
<input type="button" name="morefields" value="Add A Field" onClick="tst()">
</td>
</tr>
</table>
</form>


</body>
</html>
[/code]
and like I said, if they type something in then hit "add field" i want that information to still be there but it's not (and i'm not sure WHY it's not). And a way to align the fields, even if I have to use css (which i'm not 100% great with)
Link to comment
https://forums.phpfreaks.com/topic/30647-dynamic-field-creation/
Share on other sites

I think I know the best way to do this but can't get it to work.

I'm trying to run through each field as an array and save the information to a var to be put back into the innerHTML correctly.Here's the javascript code I have (that ISN'T working)
[code]
var tcount = 1;
var inhtml = '';
var newinfo = '';
var nameinfo = '';
var yearsinfo = '';
var n
function tst(){
var info = document.getElementById('test');
nameinfo = '';
if(tcount < 10){
if(tcount == 1){
inhtml = info.innerHTML
}
for(n in document.tform.exname){
newinfo += "<input type=\"text\" name=\"exname[]\" value=\"" + document.tform.exname[n].value + "\"> | <input type=\"text\" name=\"exyears[]\" value=\"" + document.tform.exyears[n].value + "\"><br>"
}

info.innerHTML = newinfo + inhtml
tcount = tcount + 1
return true;
} else {
return false;
}
}
[/code]

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.