Login | Iscriviti | FAQ
Anonymous

Creating a Form

+ Rispondi al messaggio

2 messaggi Pagina 1 di 1


Creating a Form

da hiyatran » ven ott 26, 2012 2:07 am

When I click on an "Add" button, it would create a new form with the "First Name", "Last Name" field and 2 textboxes, just like the original.
So if I click on the "Add" button 5 times, it would create 5 new forms for me. Same idea applies for the "Delete" button.

Here's my code:
Codice: Seleziona tutto
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
   <FORM NAME="myForm" id="facebookAcc" onsubmit="return false">
   First Name: <input type="text" name="1stName" ><br />
   Last Name: <input type="text" name="lastName" ><br /><br />
   <input id="bu_add" type="button" value="Add" >
   <input id="bu_delete" type="button" value="Delete">
   </FORM>
</body>
</html>



If you can help me out, I would greatly appreciated. Or if you know what this is call, I can just look it up.

tks
Avatar utente

hiyatran

  • Messaggi: 6
  • Iscritto il: gio giu 07, 2012 2:22 am

Re: Creating a Form

da XainPro » lun ott 29, 2012 5:02 pm

i think my this code will fulfil your this requirement..
Codice: Seleziona tutto
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>

<script type="text/javascript">
var formHtml ='<div id="entry">First Name:<input type="text" name="1stName" ><br /> Last Name: <input type="text" name="lastName" ><br /><br /></div>';

function addNewElement () {
var formHtmlData = document.getElementById("formHtmlData").innerHTML;
formHtmlData += formHtml;
document.getElementById("formHtmlData").innerHTML = formHtmlData;
}
function deleteLastElement () {
var formHtmlData = document.getElementById("formHtmlData");
formHtmlData.removeChild(document.getElementById("entry"));
}
</script>
</head>
<body>
   <FORM NAME="myForm" id="facebookAcc" onsubmit="return false">
   <div id="formHtmlData">
   <div id="entry">
   First Name: <input type="text" name="1stName" ><br />
   Last Name: <input type="text" name="lastName" ><br /><br />
   </div>
   </div>
   <input id="bu_add" type="button" value="Add" onClick="addNewElement()" >
   <input id="bu_delete" type="button" value="Delete" onClick="deleteLastElement()">
   </FORM>
</body>
</html>
Avatar utente

XainPro

  • Messaggi: 3933
  • Iscritto il: ven feb 17, 2012 8:10 pm


+ Rispondi al messaggio

Pagina 1 di 1