Store date Picker in MySql Database Using PHP
ADD_FORM.php
<head>
<link rel="stylesheet" type="text/css" href="form.css">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Add Issue</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(function () {
$("#datepicker").datepicker({ dateFormat: "yy-mm-dd", changeMonth: true, changeYear: true });
});
</script>
</head>
<form method="POST" action="insert_record.php">
<fieldset>
<legend><span class="number">1</span> Due Date</legend>
<input type="text" name="datepicker" id="datepicker">
<input type="submit" name="submit" value="Submit">
</fieldset>
</form>
Create Database
insert_record.php
<?php
$con = new mysqli('localhost', 'root', '', 'test') or die ("Unable to Connect");
if(isset($_POST['submit'])){
$due_date= $_POST['datepicker'];
$due_date = $con->real_escape_string($due_date);
$sql = "INSERT INTO date (date) Values ('$due_date')";
mysqli_query($con, $sql);
echo "Inserted Successfully!";
header('refresh:2; url=ADD_FORM.php');
}
?>
*************************************************************
date.html
<!-- Include Date Range Picker -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/>
<input class="form-control" id="date" name="date" placeholder="YYYY/MM/DD" type="text"/>
<!-- Include Date Range Picker -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<script>
$(document).ready(function(){
var date_input=$('input[name="date"]'); //our date input has the name "date"
var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
date_input.datepicker({
format: 'yyyy/mm/dd',
container: container,
todayHighlight: true,
autoclose: true,
})
})
$(document).ready(function(){
var date_input=$('input[name="date2"]'); //our date input has the name "date2"
var container=$('.bootstrap-iso form').length>0 ? $('.bootstrap-iso form').parent() : "body";
date_input.datepicker({
format: 'yyyy/mm/dd',
container: container,
todayHighlight: true,
autoclose: true,
})
})
</script>
Comments
Post a Comment