ammar0466/index.php

## index.php
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Polish My Skills with Bootstrap-JQuery</title>

<link rel="stylesheet" href="css/bootstrap.css">
</head>

<body>
<!--div container -->
<div class="container">

<form id="newform" name="newform" class="form-horizontal" enctype="multipart/form-data" action="uploadfile.php" method="post">
	<!--div panel-primary -->
	<div class="panel panel-success">
		<div class="panel-heading"><h1>Polish My Skills</h1>
		</div>

		<div class="panel-body">
			<div class="row">
				<div class="col-md-10 col-md-offset-1">
					<div class="row">
						<div class="col-md-6">
							<label>Upload File</label>
							<input class="form-control" type="file" id="myfile" name="myfile" accept="image/gif, image/jpeg"">
						</div>
					</div>
					<div class="row">
						<div class="col-md-6"><img width="216" height="180" alt="selected-file" id="imgpreview" name="imgpreview" src="" />
						</div>

					</div>
				</div>
			</div>
		</div>

		<div class="panel-footer">
				<div class="btn-group">
					<button type="submit" class="btn btn-md btn-primary">Submit</button>
					<button type="reset" id="btnreset" class="btn btn-md btn-warning">Reset</button>
				</div>
		</div>
	<!--end div primary -->
	</div>
</form>

<!--end div container -->
</div>


</body>

<script src="js/jquery-3.2.0.js"></script>
<script src="js/bootstrap.js"></script>

<script type="text/javascript">
$(document).ready(function () {
	//alert('page loaded succesffuly');

	$('#myfile').on('change', function() {
		readURL(this);
	});


	$('#btnreset').on('click', function() {
		var f=document.getElementById('newform');
		f.reset();
		//document.form.newform.reset();
		$('#imgpreview').attr('src', '');
	});
});

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
        	//document.getElementById('imgpreview').src=e.target.result;
            $('#imgpreview').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}

</script>
</html>

## uploadfile.php
<?php
$conn=mysqli_connect('localhost','root','','mudah');

if (!$conn) {
	die('Cannot connect to database');
}

echo 'Database connected...';

// if (!isset($_FILES['myfile']) || empty($_FILES['myfile']) ) {
// 	die('Empty file');
// }
// else
if ( isset($_FILES['myfile']) ) {
	$filename=$_FILES['myfile']['name'];
	$tmpfile=$_FILES['myfile']['tmp_name'];

	if (!empty($filename) ) {
		$dest='upload/'.$filename;
		move_uploaded_file($tmpfile, $dest);

		$sql="INSERT INTO product(description) VALUES ('$dest')";
		$res=mysqli_query($conn,$sql);
	}
	else {
		die('Empty file...');
	}
}

echo 'Uploading file...</br>';

$sql2="SELECT description FROM product ORDER BY id desc LIMIT 1,1";
$res2=mysqli_query($conn,$sql2);

$row2=mysqli_fetch_array($res2);
echo $row2['description'];
echo '<a href="'.$row2['description'].'">View File</a>';
?>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>Polish My Skills with Bootstrap-JQuery</title>

	<link rel="stylesheet" href="css/bootstrap.css">
	</head>

	<body>
	<!--div container -->
	<div class="container">

	<form id="newform" name="newform" class="form-horizontal" enctype="multipart/form-data" action="uploadfile.php" method="post">
	<!--div panel-primary -->
	<div class="panel panel-success">
	<div class="panel-heading"><h1>Polish My Skills</h1>
	</div>

	<div class="panel-body">
	<div class="row">
	<div class="col-md-10 col-md-offset-1">
	<div class="row">
	<div class="col-md-6">
	<label>Upload File</label>
	<input class="form-control" type="file" id="myfile" name="myfile" accept="image/gif, image/jpeg"">
	</div>
	</div>
	<div class="row">
	<div class="col-md-6"><img width="216" height="180" alt="selected-file" id="imgpreview" name="imgpreview" src="" />
	</div>

	</div>
	</div>
	</div>
	</div>

	<div class="panel-footer">
	<div class="btn-group">
	<button type="submit" class="btn btn-md btn-primary">Submit</button>
	<button type="reset" id="btnreset" class="btn btn-md btn-warning">Reset</button>
	</div>
	</div>
	<!--end div primary -->
	</div>
	</form>

	<!--end div container -->
	</div>


	</body>

	<script src="js/jquery-3.2.0.js"></script>
	<script src="js/bootstrap.js"></script>

	<script type="text/javascript">
	$(document).ready(function () {
	//alert('page loaded succesffuly');

	$('#myfile').on('change', function() {
	readURL(this);
	});


	$('#btnreset').on('click', function() {
	var f=document.getElementById('newform');
	f.reset();
	//document.form.newform.reset();
	$('#imgpreview').attr('src', '');
	});
	});

	function readURL(input) {
	if (input.files && input.files[0]) {
	var reader = new FileReader();

	reader.onload = function (e) {
	//document.getElementById('imgpreview').src=e.target.result;
	$('#imgpreview').attr('src', e.target.result);
	}

	reader.readAsDataURL(input.files[0]);
	}
	}

	</script>
	</html>
	<?php
	$conn=mysqli_connect('localhost','root','','mudah');

	if (!$conn) {
	die('Cannot connect to database');
	}

	echo 'Database connected...';

	// if (!isset($_FILES['myfile']) \|\| empty($_FILES['myfile']) ) {
	// die('Empty file');
	// }
	// else
	if ( isset($_FILES['myfile']) ) {
	$filename=$_FILES['myfile']['name'];
	$tmpfile=$_FILES['myfile']['tmp_name'];

	if (!empty($filename) ) {
	$dest='upload/'.$filename;
	move_uploaded_file($tmpfile, $dest);

	$sql="INSERT INTO product(description) VALUES ('$dest')";
	$res=mysqli_query($conn,$sql);
	}
	else {
	die('Empty file...');
	}
	}

	echo 'Uploading file...</br>';

	$sql2="SELECT description FROM product ORDER BY id desc LIMIT 1,1";
	$res2=mysqli_query($conn,$sql2);

	$row2=mysqli_fetch_array($res2);
	echo $row2['description'];
	echo '<a href="'.$row2['description'].'">View File</a>';
	?>