Google Ads

Simple Dynamic Input Using jQuery/MySQL PHP Script


Simple Dynamic Input Using jQuery/MySQL PHP Script

The Simple Dynamic Input was built using jQuery/PHP. I used Bootstrap as a front-end framework for the design. This simple application will show you how dynamic input can submit multiple data to MySQL database server.

This is the sample code for the HTML

 

<div class = "row">
<div class = "col-md-3">
</div>
<div class = "col-md-1" style = "margin-left:10px;" >
<button class = "btn btn-success" id = "add"><span class = "glyphicon glyphicon-plus"></span> Add new Entry</button>
<br />
<br />
</div>
<form method = "POST" action = "save_data.php">
<button class = "btn btn-primary" name = "submit" ><span class = "glyphicon glyphicon-save"></span> Submit</button>
<div style = "margin-left:30px;" id = "input" class = "col-md-3">
<div class = "well">
<div class = "form-group">
<label>Firstname</label>
<input class = "form-control" type = "text" name = "firstname[]"/>
</div>
<div class = "form-group">
<label>Lastname</label>
<input class = "form-control" type = "text" name = "lastname[]"/>
</div>
</div>
</div>
</form>
</div>
</body>
<script src = "js/jquery.js"></script>
<script type = "text/javascript">
$(document).ready(function(){
$('#add').click(function(){
$input = $('<div class = "well">'
+ '<br />'
+ '<div class = "form-group">'
+ '<label>Firstname</label>'
+ '<input class = "form-control" type = "text" name = "firstname[]" required = "required"/>'
+ '</div>'
+ '<div class = "form-group">'
+ '<label>Lastname</label>'
+ '<input class = "form-control" type = "text" name = "lastname[]" required = "required"/>'
+ '</div>');
$input.fadeIn(1000).appendTo('#input');
});
});
</script>

 

I hope that this kind of Source Code can be used to your projects and future project. For more tutorials and updates just visit this site. Enjoy Coding!

 

 


Related Post

Web Based Alumni Tracking System PHP Script Web Based Alumni Tracking System PHP Script his was our project during Third Year for the Research project. I hope this can help anyone who wants t...
Interactive USA Map – HTML5 PHP Script Downl... Interactive USA Map - HTML5Interactive USA Map - HTML5This is an interactive resizable vector map template built in HTML5 code and runs with javascrip...
Textpattern v4.2.0 Rc 1 Blog PHP Script Download Textpattern v4.2.0 Rc 1 Blog PHP Script Download Create a Beautiful Blog Website using this PHP Script Textpattern is a web application designed...
Tricky Crab – HTML5 Game PHP Script Download Tricky Crab - HTML5 GameTricky Crab - HTML5 GameLooks like a tricky crab made an old pirate pretty angry by stealing some of his treasures! Help the c...
Ninja Media Bulk Youtube Importer Plugin PHP Scrip... Ninja Media Bulk Youtube Importer PluginNinja Media Bulk Youtube Importer PluginNinja Media Script – Viral Fun Media Sharing Site Is a powerful runn...

Have any Question or Comment?

Leave a Reply

Your email address will not be published. Required fields are marked *