=================Code for File Upload=================
<html>
<head>
<title> File Upload </title>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js">
</script>
<script type="text/javascript">
function readURL(input)
{ //console.log(input);
if(input.files)
{
var reader = new FileReader();
reader.onload = function (e)
{
$('#inbuilt')
.attr('src', e.target.result)
.width(400)
.height(300);
};
reader.readAsDataURL(input.files[0]);
}
}
</script>
<style> <!-- CSS for multiple div -->
.wrap_div{display:flex;}
.red {color:#FF0000;}
.green {color:#00FF00;}
</style>
</head>
<body>
<form action="" method="POST" enctype="multipart/form-data">
<input type="FILE" id="id_file" onchange="readURL(this);" name="fu"><br><br>
<img id="inbuilt" hight="300" width="300" src="https://www.elementstark.com/woocommerce-extension-demos/wp-content/uploads/sites/2/2016/12/upload.png" alt="your image" /><br><br> <!-- Display Image on Choose File -->
<input type="submit" name="submit" value="Upload File">
</form>
</body>
</html>
<?php
if(isset($_FILES['fu']))
{
$f_name = $_FILES['fu'][name];
$f_size = $_FILES['fu'][size];
$tmp_name = $_FILES['fu'][tmp_name];
$f_type = $_FILES['fu'][type];
$file_ext = strtolower(end(explode('.',$f_name))); // 'end' - Points to last object...
$def_ext = array("jpeg","jpg","png");
if(in_array($file_ext,$def_ext))
{
if($f_size < 4097152)
{
move_uploaded_file($tmp_name,"C:\wamp\www/".$f_name); // Store your uploaded file in www folder which is place in wamp...
echo "<br>
<table border='2'>
<tr><th>
<div class='wrap_div'>
<div class='green'> Successfully Upload </div>
<div class='red'> ".$f_name." </div>
<div class='green'>file</div>
</div>
</th></tr>
</table>";
}
else
echo "<br><div class='red'>File size must be upto 4MB !!!</div>";
}
else
echo "<br><div class='red'>Only jpg, jpeg and png can be upload !!!</div>";
}
?>
<html>
<head>
<title> File Upload </title>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.0/jquery-ui.min.js">
</script>
<script type="text/javascript">
function readURL(input)
{ //console.log(input);
if(input.files)
{
var reader = new FileReader();
reader.onload = function (e)
{
$('#inbuilt')
.attr('src', e.target.result)
.width(400)
.height(300);
};
reader.readAsDataURL(input.files[0]);
}
}
</script>
<style> <!-- CSS for multiple div -->
.wrap_div{display:flex;}
.red {color:#FF0000;}
.green {color:#00FF00;}
</style>
</head>
<body>
<form action="" method="POST" enctype="multipart/form-data">
<input type="FILE" id="id_file" onchange="readURL(this);" name="fu"><br><br>
<img id="inbuilt" hight="300" width="300" src="https://www.elementstark.com/woocommerce-extension-demos/wp-content/uploads/sites/2/2016/12/upload.png" alt="your image" /><br><br> <!-- Display Image on Choose File -->
<input type="submit" name="submit" value="Upload File">
</form>
</body>
</html>
<?php
if(isset($_FILES['fu']))
{
$f_name = $_FILES['fu'][name];
$f_size = $_FILES['fu'][size];
$tmp_name = $_FILES['fu'][tmp_name];
$f_type = $_FILES['fu'][type];
$file_ext = strtolower(end(explode('.',$f_name))); // 'end' - Points to last object...
$def_ext = array("jpeg","jpg","png");
if(in_array($file_ext,$def_ext))
{
if($f_size < 4097152)
{
move_uploaded_file($tmp_name,"C:\wamp\www/".$f_name); // Store your uploaded file in www folder which is place in wamp...
echo "<br>
<table border='2'>
<tr><th>
<div class='wrap_div'>
<div class='green'> Successfully Upload </div>
<div class='red'> ".$f_name." </div>
<div class='green'>file</div>
</div>
</th></tr>
</table>";
}
else
echo "<br><div class='red'>File size must be upto 4MB !!!</div>";
}
else
echo "<br><div class='red'>Only jpg, jpeg and png can be upload !!!</div>";
}
?>
Comments
Post a Comment