Dynamically create input fields with jQuery

code for is start for dynamic create input field.
its very usefull to create the dymanic create input field.
this dynamic  input done by jquery.


<html>
 <head>
 <title> Dynamically create input fields with jQuery </title>
 <script  src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
 <script type="text/javascript">
 $(function() {
 var addDiv = $('#addinput');
 var i = $('#addinput p').size() + 1;

$('#addNew').live('click', function() {
 $('<p><input type="text" id="p_new" size="40" name="p_new_' + i +'" value="" placeholder="I am New" /><a href="#" id="remNew">Remove</a> </p>').appendTo(addDiv);
 i++;

return false;
 });

$('#remNew').live('click', function() {
 if( i > 2 ) {
 $(this).parents('p').remove();
 i--;
 }
 return false;
 });
 });

</script>

</head>
 <body>
 <h2>Dynamically create input fields with jQuery</h2>

<div id="addinput">
 <p>
 <input type="text" id="p_new" size="20" name="p_new" value="" placeholder="Input Value" /><a href="#" id="addNew">Add</a>
 </p>
 </div>

</body>
 </html>

Leave a comment