Adding input fields dynamically in a form
We will create a form where you will be able to add more fields to a form without making a trip to the server side. In our form, we will present the user with a single textbox and we will provide buttons for adding and removing additional textboxes.
Getting ready
Create a folder for this recipe named Recipe1 in the Chapter5 directory. Do not forget to put the jquery.js file inside the Recipe1 folder.
How to do it...
Create a file and save it as
index.htmlin theRecipe1folder and write an HTML code that will create a list with only one list item. This list item will only have a single textbox. In the end, we'll see a button that will add more fields to our form.<html> <head> <title>Add rows dynamically</title> <style type="text/css"> fieldset{width:450px;} ul{padding:2px;list-style:none;} label{float:left;width:100px;} </style> </head> <body> <form action="process...
