If you’re developing a nice website like Facebook or Youtube where subscribers share images and videos, or you’re selling premium content like e-books online, you have to provide a way for users to upload content. In this tutorial, I will show you how to add file uploading capability to your web page like a pro.
The W3C HTML Standard defines several types each designed to handle a specific type of data. For file uploading purposes, the HTML input element, aptly a tag named , has been provided. How does it work? Let’s dive straight into the tutorial to find out.
The file element is created using the input type=file as shown below. The first example creates a single file upload box whereas the second example creates a multi-file upload field.
p> label for="profile_pic">Profile Pic: label> input multiple id="profile_pic" name="profile_pic" type="file"> p> p> label for="pictures_upload">Pictures: label> input multiple id="pictures_upload" name="pictures[]" type="file"> p>
Creating a working file upload form involves more than just adding the input element. Read the details below
Fire up your favorite text editing program, in my case I will use notepad. Add this code:
html lang="en"> head> Title>File Upload TutorialTitle> head> body> body> html>
The line containing is a comment to make our code easier to read and will not be displayed to the user.
Next, add a form element between the