The filename 20200402_145303.png will be renamed to Richard Smith. Once you upload it to your web host it will always add the extensions .jpg. The Richard Smith.jpg will be saved to public_html.
Browse1.php
<html>
<head>
<title>Enrollment Step 1</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<form action="rename1.php" method="post" enctype="multipart/form-data"> <!--A PHP form action attribute specifies the location to transfer
the submitted users' information. -->
<!--The POST method transfers information via HTTP headers. -->
<!--enctype='multipart/form-data is an encoding type that allows files to be sent through a POST-->
<div class="form-group">
<!--The <div> tag defines a division or a section in an HTML document -->
<!-- class="form-group" provides a flexible class that encourages proper grouping of labels, controls, optional help text,
and form validation messaging.-->
<label class="control-label col-sm-2" for="product_id"> Select ID picture with white background to upload:</label>
<!--The <label> element is used to associate a text label with a form <input> field -->
<div class="col-sm-10">
<!--col-sm In short, they are used to define at which screen size that class should apply-->
<input type="file" class="form-control" name="image" id="fileToUpload">
<!-- The <input type="file"> defines a file-select field and a "Browse" button for file uploads -->
<!-- A form control is a user interface control that serves as the point of connection between the user and the server -->
<!--Create an HTML form that allow users to choose the image file they want to upload -->
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="product_id"> Complete name of enrolee: <input type="text" name="filename" required></label>
<!--The name attribute specifies the name SUCH FILENAME of an <input> element WHICH IS TEXT. -->
<div class="col-sm-12">
<input type="submit" class="form-control" value="Upload ID" name="submit">
<!-- Defines a submit button (for submitting the form) -->
<!--value attribute specifies the value of an <input> element.-->
</div>
</div>
</form>
</body>
</html>
<!-- An HTML element usually consists of a start tag and an end tag, with the content inserted in between:
<tagname>Content goes here...</tagname> -->
Rename1.php
<?php
if(isset($_POST['submit']))
{
$name =$_POST['filename']; //the filename goes to the variable name
// the expression isset($_POST['Submit']) return true only, if 'Submit' is an existing parameter, i.e.
//if the user has sent such a value using in HTML form
$filename = $name."".".jpg"; // replace the any file extension to .jpg of the filename.
//echo $filename;
// $target = "images/$filename"; //to images, not explaination
$target = "/$filename"; //target sets that any file will be going to public_html directory
$target_file = $target . basename($_FILES["image"]["name"]); //.basename accepts parameter path the direcotry and suffix such .jpg
move_uploaded_file($_FILES["image"]["tmp_name"], $filename);
//The move_uploaded_file() function moves an uploaded file to a new destination
// move_uploaded_file($_FILES["image"]["tmp_name"], "images/$filename"); //to images,
// move_uploaded_file($_FILES["image"]["tmp_name"], $target_file); //to images
}
?>
Watch the YouTube video. Click the video link in here.
No comments:
Post a Comment