1. Home
  2. Forums Index
  3. Server Side / PHP Server Side Scripting 1:46 am Apr 29, 2026

Forum Moderators: coopster

Message Too Old, No Replies

PHP Form with Dynamic Fields .

         

jay7981

1:49 am on May 25, 2009 (gmt 0)

10+ Year Member



OK i know u guys are going to be getting tired of me but i have yet ran into another issue, I have a form, 


<table width="100%" height="265" border="0" align="center">
 <form id="" name="" action="">
 <tr>
 <td width="422">Join Alliance Form</td>
 <td width="422"><div align="left"></div></td>
 </tr>
 <tr>
 <td>&nbsp;</td>
 <td><div align="left"></div></td>
 </tr>
 <tr>
 <td><div align="right">Guild Name:</div></td>
 <td><div align="left">
 <input type="text" name="gname" id="gname" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Guild Tag:</div></td>
 <td><div align="left">
 <input name="gtag" type="text" id="gtag" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Number of Boats in your Guild:</div></td>
 <td><div align="left">
 <input type="text" name="boatsnguild" id="boatsnguild" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Guild Leader:</div></td>
 <td><div align="left">
 <input type="text" name="gldr" id="gldr" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Leader Email:</div></td>
 <td><div align="left">
 <input type="text" name="gldremail" id="gldremail" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Council's Name:</div></td>
 <td><div align="left">
 <input type="text" name="councilname" id="councilname" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Council's Email:</div></td>
 <td><div align="left">
 <input type="text" name="councilemail" id="councilemail" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Diplomat's Name:</div></td>
 <td><div align="left">
 <input type="text" name="diploname" id="diploname" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Diplomat's Email:</div></td>
 <td><div align="left">
 <input type="text" name="diploemail" id="diploemail" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">TS Address:</div></td>
 <td><div align="left">
 <input type="text" name="tsaddy" id="tsaddy" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">TS Password:</div></td>
 <td><div align="left">
 <input type="text" name="tspass" id="tspass" />
 </div></td>
 </tr>
 <tr>
 <td><div align="right">Number of Guilds in your alliance: (If any)</div></td>
 <td><div align="left">
 <input type="text" name="numguilds" id="numguilds" />
 </div></td>
 </tr>
 <tr>
 <td colspan="2">&nbsp;</td>
 </tr>
 <tr>
 <td colspan="2"><div align="center">Other Guilds in your alliance that will be coming with you.</div></td>
 </tr>
 <td width="421"><div align="right">Guild Name:</div></td>
 <td width="421"><input type="text" name="oguild" id="oguild" /></td>
 </tr>
 
 <tr>
 <td><div align="right">Guild Leader:</div></td>
 <td><input type="text" name="ogldr" id="ogldr" /></td>
 </tr>
 <tr>
 <td><div align="right">Leader Email:</div></td>
 <td><input type="text" name="ogldremail" id="ogldremail" /></td>
 </tr>
 <tr>
 <td><div align="right">Number of Boats in this Guild:</div></td>
 <td><input type="text" name="ogboatsnguild" id="ogboatsnguild" /></td>
 </tr>
 <tr>
 <td><div align="right">Councils Name:</div></td>
 <td><input type="text" name="ogcouncilname" id="ogcouncilname" /></td>
 </tr>
 <tr>
 <td><div align="right">Councils Email:</div></td>
 <td><input type="text" name="ogcouncilemail" id="ogcouncilemail" /></td>
 </tr>
 <tr>
 <td><div align="right">Diplomats Name:</div></td>
 <td><input type="text" name="ogdiploname" id="ogdiploname" /></td>
 </tr>
 <tr>
 <td><div align="right">Diplomats Email</div></td>
 <td><input type="text" name="ogdiploemail" id="ogdiploemail" /></td>
 </tr>
 <tr>
 <td>&nbsp;</td>
 <td><input type="button" value="Add Guild" onclick="addguild()" /></td>
 </tr>
 <tr>
 <td width="421"><div align="right"></div></td>
 <td width="421">&nbsp;</td>
 </tr>
 <tr>
 <td><div align="right">Why do you want to Join?</div></td>
 <td><textarea name="comments" id="comments" cols="30" rows="8"></textarea></td>
 </tr>
 <tr>
 <td><div align="right">
 <input type="submit" name="button" id="button" value="Submit" />
 </div></td>
 <td><div align="center">
 <input type="reset" name="button2" id="button2" value="Reset" />
 </div></td>
 </tr>
 </form>
</table>
[code]
Now what i am trying to do is when the add guild button is pressed the below fields are re-created just above the "add guild" button and the id's and names of the fields are "'field'+(+count)+" 
[code]
<td width="421"><div align="right">Guild Name:</div></td>
 <td width="421"><input type="text" name="oguild" id="oguild" /></td>
 </tr>
 
 <tr>
 <td><div align="right">Guild Leader:</div></td>
 <td><input type="text" name="ogldr" id="ogldr" /></td>
 </tr>
 <tr>
 <td><div align="right">Leader Email:</div></td>
 <td><input type="text" name="ogldremail" id="ogldremail" /></td>
 </tr>
 <tr>
 <td><div align="right">Number of Boats in this Guild:</div></td>
 <td><input type="text" name="ogboatsnguild" id="ogboatsnguild" /></td>
 </tr>
 <tr>
 <td><div align="right">Councils Name:</div></td>
 <td><input type="text" name="ogcouncilname" id="ogcouncilname" /></td>
 </tr>
 <tr>
 <td><div align="right">Councils Email:</div></td>
 <td><input type="text" name="ogcouncilemail" id="ogcouncilemail" /></td>
 </tr>
 <tr>
 <td><div align="right">Diplomats Name:</div></td>
 <td><input type="text" name="ogdiploname" id="ogdiploname" /></td>
 </tr>
 <tr>
 <td><div align="right">Diplomats Email</div></td>
 <td><input type="text" name="ogdiploemail" id="ogdiploemail" /></td>
 </tr>

i have been trying to use innerhtml with out luck, and was going to try to use DOM how ever i don't know enough about the DOM writing to do this does anyone know of possibly some snippets or premade code that can do this ? I have found tons of scripts that will create a single textbox but i need it to do multiple at once, and have not been so lucky in my goggling, and since my DOM experience is pretty much NULL in trying to edit the scripts i have found have rendered the function useless.

Also all this information will be going into a mysql db once the form is submitted, and all the fields will need to be put into single fields in sql, ie: say that i fill out this form and add 2 sets of boxes, set1=inputname set2=inputname2, the info will go into their appropriate fields in sql as inputfield,inputfield2 as to be pulled out and displayed with explode() this much i have already coded and tests passed fine, just wanted to add this comment so all would know why i am trying to do this, giving the big picture.

enigma1

10:15 am on May 25, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Here is some js code along with the one you posted that may help. Should add new sections of an html segment once you click the addguild button. You can format it and modify it.

I used a table with an id of "guilds" for the section. You should be able to setup a count for the js function so the html var changes the fields every time a new segment is generated. So for instance on this line
' <td><input type="text" name="ogldr" id="ogldr".....
could been
' <td><input type="text" name="ogldr' + g_index + '" id="'ogldr' + g_index + '"' +

setup a g_index to be incremented everytime the function is called. Here is the whole code, haven't placed the indices. 


<script language="javascript"><!--
function addguild() {
var html = "";
  html +=  
   '<tr>' +
   ' <td width="421"><div align="right">Guild Name:</div></td>' +
   ' <td width="421"><input type="text" name="oguild" id="oguild" /></td>' +
   '</tr>' +
   '<tr>' +
   ' <td><div align="right">Guild Leader:</div></td>' +
   ' <td><input type="text" name="ogldr" id="ogldr" /></td>' +
   '</tr>' +
   '<tr>' +
   ' <td><div align="right">Leader Email:</div></td>' +
   ' <td><input type="text" name="ogldremail" id="ogldremail" /></td>' +
   '</tr>' +
   '<tr>' +
   ' <td><div align="right">Number of Boats in this Guild:</div></td>' +
   ' <td><input type="text" name="ogboatsnguild" id="ogboatsnguild" /></td>' +
   '</tr>' +
   '<tr>' +
   ' <td><div align="right">Councils Name:</div></td>' +
   ' <td><input type="text" name="ogcouncilname" id="ogcouncilname" /></td>' +
   '</tr>' +
   '<tr>' +
   ' <td><div align="right">Councils Email:</div></td>' +
   ' <td><input type="text" name="ogcouncilemail" id="ogcouncilemail" /></td>' +
   '</tr>' +
   '<tr>' +
   ' <td><div align="right">Diplomats Name:</div></td>' +
   ' <td><input type="text" name="ogdiploname" id="ogdiploname" /></td>' +
   '</tr>' +
   '<tr>' +
   ' <td><div align="right">Diplomats Email</div></td>' +
   ' <td><input type="text" name="ogdiploemail" id="ogdiploemail" /></td>' +
   '</tr>';
newGuild = document.createElement("table");
newGuild.className = "someCSSClass";
newGuild.setAttribute("class", "newGuild");
newGuild.style.display = "block";
newGuild.style.position = 'relative';
  newGuild.innerHTML = html;
  newElem = document.getElementById("guilds");
  newElem.appendChild(newGuild);
}
//--></script>
<div><table width="100%" height="265" border="0" align="center"><form id="" name="" action="">
 <tr>
  <td width="422">Join Alliance Form</td>
  <td width="422"><div align="left"></div></td>
 </tr>
 <tr>
  <td>&nbsp;</td>
  <td><div align="left"></div></td>
 </tr>
 <tr>
  <td><div align="right">Guild Name:</div></td>
  <td><div align="left"><input type="text" name="gname" id="gname" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Guild Tag:</div></td>
  <td><div align="left"><input name="gtag" type="text" id="gtag" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Number of Boats in your Guild:</div></td>
  <td><div align="left"><input type="text" name="boatsnguild" id="boatsnguild" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Guild Leader:</div></td>
  <td><div align="left"><input type="text" name="gldr" id="gldr" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Leader Email:</div></td>
  <td><div align="left"><input type="text" name="gldremail" id="gldremail" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Council's Name:</div></td>
  <td><div align="left"><input type="text" name="councilname" id="councilname" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Council's Email:</div></td>
  <td><div align="left"><input type="text" name="councilemail" id="councilemail" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Diplomat's Name:</div></td>
  <td><div align="left"><input type="text" name="diploname" id="diploname" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Diplomat's Email:</div></td>
  <td><div align="left"><input type="text" name="diploemail" id="diploemail" /></div></td>
 </tr>
 <tr>
  <td><div align="right">TS Address:</div></td>
  <td><div align="left"><input type="text" name="tsaddy" id="tsaddy" /></div></td>
 </tr>
 <tr>
  <td><div align="right">TS Password:</div></td>
  <td><div align="left"><input type="text" name="tspass" id="tspass" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Number of Guilds in your alliance: (If any)</div></td>
  <td><div align="left"><input type="text" name="numguilds" id="numguilds" /></div></td>
 </tr>
 <tr>
  <td colspan="2">&nbsp;</td>
 </tr>
 <tr>
  <td colspan="2"><div align="center">Other Guilds in your alliance that will be coming with you.</div></td>
 </tr>
 <tr>
  <td colspan="2"><table width="100%" height="265" border="0" id="guilds">
   <tr>
    <td width="421"><div align="right">Guild Name:</div></td>
    <td width="421"><input type="text" name="oguild" id="oguild" /></td>
   </tr>
   <tr>
    <td><div align="right">Guild Leader:</div></td>
    <td><input type="text" name="ogldr" id="ogldr" /></td>
   </tr>
   <tr>
    <td><div align="right">Leader Email:</div></td>
    <td><input type="text" name="ogldremail" id="ogldremail" /></td>
   </tr>
   <tr>
    <td><div align="right">Number of Boats in this Guild:</div></td>
    <td><input type="text" name="ogboatsnguild" id="ogboatsnguild" /></td>
   </tr>
   <tr>
    <td><div align="right">Councils Name:</div></td>
    <td><input type="text" name="ogcouncilname" id="ogcouncilname" /></td>
   </tr>
   <tr>
    <td><div align="right">Councils Email:</div></td>
    <td><input type="text" name="ogcouncilemail" id="ogcouncilemail" /></td>
   </tr>
   <tr>
    <td><div align="right">Diplomats Name:</div></td>
    <td><input type="text" name="ogdiploname" id="ogdiploname" /></td>
   </tr>
   <tr>
    <td><div align="right">Diplomats Email</div></td>
    <td><input type="text" name="ogdiploemail" id="ogdiploemail" /></td>
   </tr>
  </table></td>
 </tr>
 <tr>
  <td>&nbsp;</td>
  <td><input type="button" value="Add Guild" id="addguildroot" onclick="addguild()" /></td>
 </tr>
 <tr>
  <td width="421"><div align="right"></div></td>
  <td width="421">&nbsp;</td>
 </tr>
 <tr>
  <td><div align="right">Why do you want to Join?</div></td>
  <td><textarea name="comments" id="comments" cols="30" rows="8"></textarea></td>
 </tr>
 <tr>
  <td><div align="right"><input type="submit" name="button" id="button" value="Submit" /></div></td>
  <td><div align="center"><input type="reset" name="button2" id="button2" value="Reset" /></div></td>
 </tr>
</form></table></div>

When the form is submitted perhaps would be better to use an array for the form fields instead of the plain index extensions. Something like
'[' + g_index + ']'
for each field. Will be easier to retrieve the _POST vars and process each array.

jay7981

6:16 pm on May 25, 2009 (gmt 0)

10+ Year Member



ok that is working out great but the position of the newly created table is not working out ... i have tried and tried to reposition it but it is causing the button not to be functional... weird ..

[edited by: coopster at 12:19 am (utc) on May 26, 2009]
[edit reason] no personal urls please TOS [webmasterworld.com] [/edit]

enigma1

9:56 am on May 26, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



you need to do a bit of re-formating. Keep in mind IE doesn't accept every element for the innerhtml assignment (missed that) so I moded the code to use a div instead of a table for the insertion and simplified the code.

Here is a modified version. 


<script language="javascript"><!--
function addguild() {
var html = "";
  html +=  
   '<tr>' +
   ' <td><table width="100%" border="0">' +
   '  <tr>' +
   '   <td width="421"><div align="right">Guild Name:</div></td>' +
   '   <td width="421"><input type="text" name="oguild" id="oguild" /></td>' +
   '  </tr>' +
   '  <tr>' +
   '   <td><div align="right">Guild Leader:</div></td>' +
   '   <td><input type="text" name="ogldr" id="ogldr" /></td>' +
   '  </tr>' +
   '  <tr>' +
   '   <td><div align="right">Leader Email:</div></td>' +
   '   <td><input type="text" name="ogldremail" id="ogldremail" /></td>' +
   '  </tr>' +
   '  <tr>' +
   '   <td><div align="right">Number of Boats in this Guild:</div></td>' +
   '   <td><input type="text" name="ogboatsnguild" id="ogboatsnguild" /></td>' +
   '  </tr>' +
   '  <tr>' +
   '   <td><div align="right">Councils Name:</div></td>' +
   '   <td><input type="text" name="ogcouncilname" id="ogcouncilname" /></td>' +
   '  </tr>' +
   '  <tr>' +
   '   <td><div align="right">Councils Email:</div></td>' +
   '   <td><input type="text" name="ogcouncilemail" id="ogcouncilemail" /></td>' +
   '  </tr>' +
   '  <tr>' +
   '   <td><div align="right">Diplomats Name:</div></td>' +
   '   <td><input type="text" name="ogdiploname" id="ogdiploname" /></td>' +
   '  </tr>' +
   '  <tr>' +
   '   <td><div align="right">Diplomats Email</div></td>' +
   '   <td><input type="text" name="ogdiploemail" id="ogdiploemail" /></td>' +
   '  </tr>' +
   ' </table></td>' +
   '</tr>'+
   '<tr><td>&nbsp;</td></tr>';
  newElem = document.getElementById("guilds");
  oldGuild = newElem.innerHTML;
  newElem.innerHTML = oldGuild+html;
}
//--></script>
<table width="100%" height="265" border="0" align="center"><form id="" name="" action="">
 <tr>
  <td width="422">Join Alliance Form</td>
  <td width="422"><div align="left"></div></td>
 </tr>
 <tr>
  <td>&nbsp;</td>
  <td><div align="left"></div></td>
 </tr>
 <tr>
  <td><div align="right">Guild Name:</div></td>
  <td><div align="left"><input type="text" name="gname" id="gname" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Guild Tag:</div></td>
  <td><div align="left"><input name="gtag" type="text" id="gtag" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Number of Boats in your Guild:</div></td>
  <td><div align="left"><input type="text" name="boatsnguild" id="boatsnguild" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Guild Leader:</div></td>
  <td><div align="left"><input type="text" name="gldr" id="gldr" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Leader Email:</div></td>
  <td><div align="left"><input type="text" name="gldremail" id="gldremail" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Council's Name:</div></td>
  <td><div align="left"><input type="text" name="councilname" id="councilname" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Council's Email:</div></td>
  <td><div align="left"><input type="text" name="councilemail" id="councilemail" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Diplomat's Name:</div></td>
  <td><div align="left"><input type="text" name="diploname" id="diploname" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Diplomat's Email:</div></td>
  <td><div align="left"><input type="text" name="diploemail" id="diploemail" /></div></td>
 </tr>
 <tr>
  <td><div align="right">TS Address:</div></td>
  <td><div align="left"><input type="text" name="tsaddy" id="tsaddy" /></div></td>
 </tr>
 <tr>
  <td><div align="right">TS Password:</div></td>
  <td><div align="left"><input type="text" name="tspass" id="tspass" /></div></td>
 </tr>
 <tr>
  <td><div align="right">Number of Guilds in your alliance: (If any)</div></td>
  <td><div align="left"><input type="text" name="numguilds" id="numguilds" /></div></td>
 </tr>
 <tr>
  <td colspan="2">&nbsp;</td>
 </tr>
 <tr>
  <td colspan="2"><div align="center">Other Guilds in your alliance that will be coming with you.</div></td>
 </tr>
 <tr>
  <td colspan="2" align="center"><div style="width:100%; position:relative; padding:0; margin:0" id="guilds">
   <tr>
    <td width="421"><div align="right">Guild Name:</div></td>
    <td width="421"><input type="text" name="oguild" id="oguild" /></td>
   </tr>
   <tr>
    <td><div align="right">Guild Leader:</div></td>
    <td><input type="text" name="ogldr" id="ogldr" /></td>
   </tr>
   <tr>
    <td><div align="right">Leader Email:</div></td>
    <td><input type="text" name="ogldremail" id="ogldremail" /></td>
   </tr>
   <tr>
    <td><div align="right">Number of Boats in this Guild:</div></td>
    <td><input type="text" name="ogboatsnguild" id="ogboatsnguild" /></td>
   </tr>
   <tr>
    <td><div align="right">Councils Name:</div></td>
    <td><input type="text" name="ogcouncilname" id="ogcouncilname" /></td>
   </tr>
   <tr>
    <td><div align="right">Councils Email:</div></td>
    <td><input type="text" name="ogcouncilemail" id="ogcouncilemail" /></td>
   </tr>
   <tr>
    <td><div align="right">Diplomats Name:</div></td>
    <td><input type="text" name="ogdiploname" id="ogdiploname" /></td>
   </tr>
   <tr>
    <td><div align="right">Diplomats Email</div></td>
    <td><input type="text" name="ogdiploemail" id="ogdiploemail" /></td>
   </tr>
  </div></td>
 </tr>
 <tr>
  <td>&nbsp;</td>
  <td><input type="button" value="Add Guild" id="addguildroot" onclick="addguild()" /></td>
 </tr>
 <tr>
  <td width="421"><div align="right"></div></td>
  <td width="421">&nbsp;</td>
 </tr>
 <tr>
  <td><div align="right">Why do you want to Join?</div></td>
  <td><textarea name="comments" id="comments" cols="30" rows="8"></textarea></td>
 </tr>
 <tr>
  <td><div align="right"><input type="submit" name="button" id="button" value="Submit" /></div></td>
  <td><div align="center"><input type="reset" name="button2" id="button2" value="Reset" /></div></td>
 </tr>
</form></table>

jay7981

9:40 pm on May 26, 2009 (gmt 0)

10+ Year Member



ok new problem .. added code that i beleieve has worked in the past but its now not incrementing the field names ... 


<script language="javascript"><!--
var i=1;
function addguild() {
var html = "";
html +=
'<tr>' +
' <td><table width="100%" border="0">' +
' <tr>' +
' <td width="421"><div align="right">Guild Name:</div></td>' +
' <td width="421"><input type="text" name="oguild +['+i']+" id="oguild" /></td>' +
' </tr>' +
' <tr>' +
' <td><div align="right">Guild Leader:</div></td>' +
' <td><input type="text" name="ogldr +['+i']+" id="ogldr" /></td>' +
' </tr>' +
' <tr>' +
' <td><div align="right">Leader Email:</div></td>' +
' <td><input type="text" name="ogldremail +['+i']+" id="ogldremail" /></td>' +
' </tr>' +
' <tr>' +
' <td><div align="right">Number of Boats in this Guild:</div></td>' +
' <td><input type="text" name="ogboatsnguild +['+i']+" id="ogboatsnguild" /></td>' +
' </tr>' +
' <tr>' +
' <td><div align="right">Councils Name:</div></td>' +
' <td><input type="text" name="ogcouncilname +['+i']+" id="ogcouncilname" /></td>' +
' </tr>' +
' <tr>' +
' <td><div align="right">Councils Email:</div></td>' +
' <td><input type="text" name="ogcouncilemail +['+i']+" id="ogcouncilemail" /></td>' +
' </tr>' +
' <tr>' +
' <td><div align="right">Diplomats Name:</div></td>' +
' <td><input type="text" name="ogdiploname +['+i']+" id="ogdiploname" /></td>' +
' </tr>' +
' <tr>' +
' <td><div align="right">Diplomats Email</div></td>' +
' <td><input type="text" name="ogdiploemail +['+i']+" id="ogdiploemail" /></td>' +
' </tr>' +
' </table></td>' +
'</tr>'+
'<tr><td>&nbsp;</td></tr>';

enigma1

9:29 am on May 27, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



You need to increment the index for the arrays. Also now is best to use unique ids to be HTML compliant (so I used the index to differentiate the ids). It's also best not to use common vars such as i in the global scope (used g_guild_index instead)

I did rearrange the div so it will be at the end of the root guild as it was inserting the nodes before the root. Here is the moded version. 


<script language="javascript"><!--
var g_guild_index=1;
function addguild() {
var html = "";
 html += 
  '<tr>' +
  ' <td><table width="100%" border="0">' +
  ' <tr>' +
  '  <td width="421"><div align="right">Guild Name:</div></td>' +
  '  <td width="421"><input type="text" name="oguild['+g_guild_index+']" id="oguild_'+g_guild_index+'" /></td>' +
  ' </tr>' +
  ' <tr>' +
  '  <td><div align="right">Guild Leader:</div></td>' +
  '  <td><input type="text" name="ogldr['+g_guild_index+']" id="ogldr_'+g_guild_index+'" /></td>' +
  ' </tr>' +
  ' <tr>' +
  '  <td><div align="right">Leader Email:</div></td>' +
  '  <td><input type="text" name="ogldremail['+g_guild_index+']" id="ogldremail_'+g_guild_index+'" /></td>' +
  ' </tr>' +
  ' <tr>' +
  '  <td><div align="right">Number of Boats in this Guild:</div></td>' +
  '  <td><input type="text" name="ogboatsnguild['+g_guild_index+']" id="ogboatsnguild_'+g_guild_index+'" /></td>' +
  ' </tr>' +
  ' <tr>' +
  '  <td><div align="right">Councils Name:</div></td>' +
  '  <td><input type="text" name="ogcouncilname['+g_guild_index+']" id="ogcouncilname_'+g_guild_index+'" /></td>' +
  ' </tr>' +
  ' <tr>' +
  '  <td><div align="right">Councils Email:</div></td>' +
  '  <td><input type="text" name="ogcouncilemail['+g_guild_index+']" id="ogcouncilemail_'+g_guild_index+'" /></td>' +
  ' </tr>' +
  ' <tr>' +
  '  <td><div align="right">Diplomats Name:</div></td>' +
  '  <td><input type="text" name="ogdiploname['+g_guild_index+']" id="ogdiploname_'+g_guild_index+'" /></td>' +
  ' </tr>' +
  ' <tr>' +
  '  <td><div align="right">Diplomats Email</div></td>' +
  '  <td><input type="text" name="ogdiploemail['+g_guild_index+']" id="ogdiploemail_'+g_guild_index+'" value="'+g_guild_index+'" /></td>' +
  ' </tr>' +
  ' </table></td>' +
  '</tr>'+
  '<tr><td>&nbsp;</td></tr>';
 newElem = document.getElementById("newguild");
 newElem.innerHTML += html;
 g_guild_index++;
}
//--></script>
<table width="100%" height="265" border="0" align="center"><form id="" name="" action="">
 <tr>
 <td width="422">Join Alliance Form</td>
 <td width="422"><div align="left"></div></td>
 </tr>
 <tr>
 <td>&nbsp;</td>
 <td><div align="left"></div></td>
 </tr>
 <tr>
 <td><div align="right">Guild Name:</div></td>
 <td><div align="left"><input type="text" name="gname" id="gname" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Guild Tag:</div></td>
 <td><div align="left"><input name="gtag" type="text" id="gtag" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Number of Boats in your Guild:</div></td>
 <td><div align="left"><input type="text" name="boatsnguild" id="boatsnguild" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Guild Leader:</div></td>
 <td><div align="left"><input type="text" name="gldr" id="gldr" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Leader Email:</div></td>
 <td><div align="left"><input type="text" name="gldremail" id="gldremail" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Council's Name:</div></td>
 <td><div align="left"><input type="text" name="councilname" id="councilname" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Council's Email:</div></td>
 <td><div align="left"><input type="text" name="councilemail" id="councilemail" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Diplomat's Name:</div></td>
 <td><div align="left"><input type="text" name="diploname" id="diploname" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Diplomat's Email:</div></td>
 <td><div align="left"><input type="text" name="diploemail" id="diploemail" /></div></td>
 </tr>
 <tr>
 <td><div align="right">TS Address:</div></td>
 <td><div align="left"><input type="text" name="tsaddy" id="tsaddy" /></div></td>
 </tr>
 <tr>
 <td><div align="right">TS Password:</div></td>
 <td><div align="left"><input type="text" name="tspass" id="tspass" /></div></td>
 </tr>
 <tr>
 <td><div align="right">Number of Guilds in your alliance: (If any)</div></td>
 <td><div align="left"><input type="text" name="numguilds" id="numguilds" /></div></td>
 </tr>
 <tr>
 <td colspan="2">&nbsp;</td>
 </tr>
 <tr>
 <td colspan="2"><div align="center">Other Guilds in your alliance that will be coming with you.</div></td>
 </tr>
 <tr>
 <td colspan="2" align="center">
  <tr>
  <td width="421"><div align="right">Guild Name:</div></td>
  <td width="421"><input type="text" name="oguild[0]" id="oguild" /></td>
  </tr>
  <tr>
  <td><div align="right">Guild Leader:</div></td>
  <td><input type="text" name="ogldr[0]" id="ogldr_0" /></td>
  </tr>
  <tr>
  <td><div align="right">Leader Email:</div></td>
  <td><input type="text" name="ogldremail[0]" id="ogldremail_0" /></td>
  </tr>
  <tr>
  <td><div align="right">Number of Boats in this Guild:</div></td>
  <td><input type="text" name="ogboatsnguild[0]" id="ogboatsnguild_0" /></td>
  </tr>
  <tr>
  <td><div align="right">Councils Name:</div></td>
  <td><input type="text" name="ogcouncilname[0]" id="ogcouncilname_0" /></td>
  </tr>
  <tr>
  <td><div align="right">Councils Email:</div></td>
  <td><input type="text" name="ogcouncilemail[0]" id="ogcouncilemail_0" /></td>
  </tr>
  <tr>
  <td><div align="right">Diplomats Name:</div></td>
  <td><input type="text" name="ogdiploname[0]" id="ogdiploname_0" /></td>
  </tr>
  <tr>
  <td><div align="right">Diplomats Email</div></td>
  <td><input type="text" name="ogdiploemail[0]" id="ogdiploemail_0" /></td>
  </tr>
 </td>
 </tr>
 <tr><td>&nbsp;</td></tr>
 <tr>
 <td colspan="2" align="center"><div style="width:100%; position:relative; padding:0; margin:0" id="newguild">
 </div></td>
 <tr>
 <td>&nbsp;</td>
 <td><input type="button" value="Add Guild" onclick="addguild()" /></td>
 </tr>
 <tr>
 <td width="421"><div align="right"></div></td>
 <td width="421">&nbsp;</td>
 </tr>
 <tr>
 <td><div align="right">Why do you want to Join?</div></td>
 <td><textarea name="comments" id="comments" cols="30" rows="8"></textarea></td>
 </tr>
 <tr>
 <td><div align="right"><input type="submit" name="button" id="button" value="Submit" /></div></td>
 <td><div align="center"><input type="reset" name="button2" id="button2" value="Reset" /></div></td>
 </tr>
</form></table>

PS I forgot to remove the value I used for testing from the html string inside the js function. Just remove it as it shows the index/counter with the input field

jay7981

2:59 pm on May 27, 2009 (gmt 0)

10+ Year Member



Dude, You rock! thanks a ton you have saved my entire project... Will definitely be referring anyone i know that has an issue to this site!

However, now its not submitting the incremented fields ...

I have form action set as "" and submitted the form to see what all would be passed in the address bar, and this is all that is being sent... I tested it in Firefox and IE it works in IE but not Firefox ....

FireFox: 


?gname=sadfasdfa
&gtag=sadfasdfa
&boatsnguild=sadfasdfa
&gldr=sadfasdfa
&gldremail=sadfasdfa
&councilname=sadfasdfa
&councilemail=sadfasdfa
&diploname=sadfasdfa
&diploemail=sadfasdfa
&tsaddy=sadfasdfa
&tspass=sadfasdfa
&numguilds=sadfasdfa
&oguild[0]=sadfasdfa
&ogldr[0]=sadfasdfa
&ogldremail[0]=sadfasdfa
&ogboatsnguild[0]=sadfasdfa
&ogcouncilname[0]=sadfasdfa
&ogcouncilemail[0]=sadfasdfa
&ogdiploname[0]=sadfasdfa
&ogdiploemail[0]=sadfasdfa
&comments=sadfasdfa
&button=Submit (<---- Weird)

IE: 


?gname=
&gtag=
&boatsnguild=
&gldr=
&gldremail=
&councilname=
&councilemail=
&diploname=
&diploemail=
&tsaddy=
&tspass=
&numguilds=
&oguild0=
&ogldr0=
&ogldremail0=
&ogboatsnguild0=
&ogcouncilname0=
&ogcouncilemail0=
&ogdiploname0=
&ogdiploemail0=
&oguild1=
&ogldr1=
&ogldremail1=
&ogboatsnguild1=
&ogcouncilname1=
&ogcouncilemail1=
&ogdiploname1=
&ogdiploemail1=
&comments=
&button=Submit (<---- Again Weird)

enigma1

7:30 am on May 28, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



you have a value for the button. Look at this line
<td><div align="right"><input type="submit" name="button" id="button" value="Submit" /></div></td>
so this included with the form data.

One other thing, once you complete the form make sure its HTML validates properly (the problem you're having). Otherwise the elements inserted with js may not be included in the form. (especially with FF). One mistake there is already, is that the form opens after the table definition while it should been before.

not <table><form>
but <form><table>
and you need to swap the closing tags too.

ddvalk

6:19 am on Jun 9, 2009 (gmt 0)

10+ Year Member



This was *very* helpful - thanks, all!

If you cut and paste the code in the last example, the page works except for the following quirk: If you enter information in a second or third guild section (added using "Add Guild" button) then add another Guild, the data you entered is blanked out. I cannot figure out how to preserve that data. And not preserving that data is essential as it'll be quite frustrating to those using the form.

Any thoughts on this? Can we grab that data using javascript variables and populate the previous forms using "value" tags on the form items?

jay7981

2:30 pm on Jun 9, 2009 (gmt 0)

10+ Year Member



what i did was since i know there wont be more than 10 entries i set up the form processing for to use the var

@$gname = addslashes($_GET['oguild,oguild1,oguild2,oguild3...ect']);

wasn't real sure how to do it to where it checked how many entries there actually were and then process it so i just manually did it to 10

ddvalk

4:17 pm on Jun 9, 2009 (gmt 0)

10+ Year Member



Actually, I was talking about the original page entries (the form itself that the user sees). Turns out, the blanking only happens within Firefox - IE works just fine. Still - it'd be nice to fix it in Firefox.

Regarding your response (jay7981), I used
foreach (array_keys($_POST["oguild"]) as $i) {

enigma1

6:04 pm on Jun 9, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Actually, I was talking about the original page entries (the form itself that the user sees). Turns out, the blanking only happens within Firefox - IE works just fine. Still - it'd be nice to fix it in Firefox.

If you read my previous post it explains that you need to validate the generated html code. There are basic errors with the table and form.

ddvalk

6:32 pm on Jun 9, 2009 (gmt 0)

10+ Year Member



Ah - so you think there are other html nuances in there that may be causing trouble - other than the table and form (which I switched).

I'll see about checking that and see if it helps.

enigma1

6:43 pm on Jun 9, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Could be, use the w3c validator make sure the page comes up clean of html errors. If necessary copy the html that the js function generates into the html body and validate it. When I tested that here I did switch the table and form (in both places) and then it was ok with FF.

jay7981

3:15 am on Jun 10, 2009 (gmt 0)

10+ Year Member



yea i got it working in FF there were several ',",` issues that i fixed in the finished form and it worked flawlessly in FF, but more info on the : 

foreach (array_keys($_POST["oguild"]) as $i) {

would be greatly appreciated.

ddvalk

3:29 am on Jun 10, 2009 (gmt 0)

10+ Year Member



Hmm - I'm not seeing any quote issues. Got an example of what I'm looking for?

Here's a clip from my form processor using the array. Works nicely.

My form has "cfname[0]" in place of:
<input type="text" name="oguild[0]" id="oguild" />
and
oguild['+g_guild_index+']

I also have grade['+index+'], hence the reference there. Hope this helps.

foreach (array_keys($_POST["cfname"]) as $i) {
if (!empty($_POST["cfname"][$i])) {
$siblings .= $_POST[cfname][$i] . " (" . $_POST[grade][$i] . ") ";
}
}

enigma1

9:33 am on Jun 10, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Sorry I am not following now. This php code you posted, is it for the form processing? Can you post the entire script page (or at least the part that processes the form) so I can see what is not working?
 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

  1. Home
  2. Forums Index
  3. Server Side / PHP Server Side Scripting 1:46 am Apr 29, 2026