-
-
Save IbraheemSalem/e171c248655b95a6e03206de25fa3a61 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
include('connect.php'); | |
//insert data into database | |
if(isset($_POST['save'])){ | |
$name=$_POST['name']; | |
$age=$_POST['age']; | |
$target="images/".basename($_FILES['image']['name']); | |
$sql="INSERT INTO image(name,age,image)VALUES('$name','$age','$target')"; | |
$stmt=$con->prepare($sql); | |
$stmt->execute(); | |
move_uploaded_file($_FILES['image']['tmp_name'],$target); | |
echo "<div class='alert alert-success' role='alert'>Submitted Successfully</div>"; | |
} | |
//fetch the data from table | |
$stmt2 = $con->prepare("select * from image order by id DESC"); | |
$stmt2->execute(); | |
$details = $stmt2->fetchAll(PDO::FETCH_ASSOC); | |
?> | |
<html> | |
<head> | |
<title>image example</title> | |
<link rel="stylesheet" href="bootstrap.css" crossorigin="anonymous"> | |
<!-- Optional theme --> | |
<link rel="stylesheet" href="bootstrap-theme.css" crossorigin="anonymous"> | |
<style> | |
.container{ | |
width:50%; | |
height:30%; | |
padding:20px; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="container"> | |
<h3><u>Upload image and insert into database in PHP</u></h3> | |
<br/> | |
<form action="" method="post" enctype="multipart/form-data"> | |
<div class="row"> | |
<div class="col-sm-8"> | |
<div class="form-group"> | |
<label for="name">Name:</label> | |
<input type="text" class="form-control" name="name"> | |
</div> | |
</div> | |
</div> | |
<div class="row"> | |
<div class="col-sm-8"> | |
<div class="form-group"> | |
<label for="name">Age*:</label> | |
<input type="number" class="form-control" name="age"> | |
</div> | |
</div> | |
</div> | |
<div class="row"> | |
<div class="col-sm-8"> | |
<div class="form-group"> | |
<label for="name">Image*:</label> | |
<input type="file" class="form-control" name="image"> | |
</div> | |
</div> | |
</div> | |
<br/><br/> | |
<button type="submit" class="btn btn-primary" name="save">Submit</button> | |
</form> | |
<br/><br/> | |
<h3>View Details</h3><br/> | |
<table class="table table-bordered"> | |
<thead> | |
<tr> | |
<th>Name</th> | |
<th>Age</th> | |
<th>Image</th> | |
</tr> | |
</thead> | |
<tbody> | |
<?php | |
foreach($details as $detail){ | |
if($detail){ | |
?> | |
<tr> | |
<td><?php echo $detail['name'];?></td> | |
<td><?php echo $detail['age'];?></td> | |
<td><img src="<?php echo $detail['image']?>" width="200" height="150" alt="photo"></img></td> | |
</tr> | |
<?php | |
} | |
else{ | |
?> | |
<tr> | |
<td colspan="3" style="text-align: center">Not available</td> | |
</tr> | |
<?php | |
} | |
} | |
?> | |
</tbody> | |
</table> | |
</div> | |
<script src="jquery-3.2.1.min.js"></script> | |
<script src="bootstrap.min.js"></script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment