<?php
$connect = mysqli_connect("localhost","root","","shopping");
if (isset($_POST["insert_image"]))
{
	$file = addcslashes(file_get_contents($_FILES["image"]["tmp_name"]));
	$query = "INSERT INTO test(name,image_dir) VALUES ('$name','$file');";
	if (mysqli_query($connect,$query)) 
	{
		echo '<script>alert("Image Inserted sucessfully");</script>';	
	}
}
?>
<!DOCTYPE html>
<html>
<head>
	<title>pic</title>
	<link rel="stylesheet" type="text/css" href="css/login.css">
</head>
<body>
	<div class="header">
		<h2>Add Image</h2>
	</div>
	<form method="post" action="demo.php" enctype="multipart/form-data">
	<div class="input-group">
		<label>Name</label>
		<input type="text" name="pname" required><br>
	</div>
	<div class="input-group">
		<label>Select Photo</label>
		<input type="file" id="image" name="image" value="" multiple=""><br>
	</div>
	<center>
	<div class="input-group">
		<button class="btn" id="insert_image" type="submit" name="submit_button">Submit</button>
	</div>
	</center>
	</form>
</body>
<script type="text/javascript">
	$(document).ready(function(){
		$('#insert_image').click(function(){
			var image_name = $('#image').val();
			if (image_name == '')
			{
				alert("Please Select Image");
				return false;
			}
			else
			{
				var extension = $('#image').val().split('.').pop().toLowerCase();
				if (jQuery.inArray(extension,['gif','png','jpg','jpeg']) == -1)
				{
					alert('Invalid ImageFile');
					$('#image').val('');
					return false;
				}
			}
		});
	});
</script>
</html>