Create table
CREATE TABLE `invoice` (
`id` int(11) NOT NULL,
`name` varchar(40) NOT NULL,
`detail` varchar(33) NOT NULL,
`type` varchar(33) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = 'test';
// Create connection
$conn = new mysqli($servername, $username, $password,$dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
//echo "Connected successfully";
?>
<?php include('connection.php');
if(isset($_POST['submit'])){
$date = $_POST['field1'];
foreach( $date as $key => $d ) {
$sql = "INSERT INTO invoice (name) VALUES ('$date[$key]')";
if ($conn->query($sql) === TRUE) {
echo "New record created successfully".mysqli_affected_rows($conn);
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
}
}
?>
<!DOCTYPE html>
<html>
<head>
<title>multiple fields</title>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<style>
* {
.border-radius(0) !important;
}
#field {
margin-bottom:20px;
}
</style>
</head>
<body>
<div class="container">
<div class="row">
<input type="hidden" name="count" value="1" />
<div class="control-group" id="fields">
<label class="control-label" for="field1">Nice Multiple Form Fields</label>
<div class="controls" id="profs">
<form class="input-append" method="post">
<div id="field">
<input type="text" name="field1[]" class="input" id="field1" data-items="8"/>
<button id="b1" class="btn add-more" type="submit">+</button>
</div>
<button type="submit" name="submit">Submit</button>
</form>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function(){
var next = 1;
$(".add-more").click(function(e){
e.preventDefault();
var addto = "#field" + next;
var addRemove = "#field" + (next);
next = next + 1;
var newIn = '<input autocomplete="off" class="input form-control" id="field' + next + '" name="field1[]" type="text">'; var newInput = $(newIn);
var removeBtn = '<button id="remove' + (next - 1) + '" class="btn btn-danger remove-me" >-</button></div><div id="field">';
var removeButton = $(removeBtn);
$(addto).after(newInput);
$(addRemove).after(removeButton);
$("#field" + next).attr('data-source',$(addto).attr('data-source'));
$("#count").val(next);
$('.remove-me').click(function(e){
e.preventDefault();
var fieldNum = this.id.charAt(this.id.length-1);
var fieldID = "#field" + fieldNum;
$(this).remove();
$(fieldID).remove();
});
});
});
</script>
</body>
</html>
Wednesday, September 5, 2018
How to create dynamic input and insert into database
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment