How to Upload a File to My Server Using HTML

how to upload a file to my server using html

<form id="uploadbanner" enctype="multipart/form-data" method="post" action="#">
   <input id="fileupload" name="myfile" type="file" />
   <input type="submit" value="submit" id="submit" />
</form>

To upload a file, it is essential to set enctype="multipart/form-data" on your form

You need that form type and then some php to process the file :)

You should probably check out Uploadify if you want something very customisable out of the box.

How do I Upload Files to my Web Server Through a Webpage on the Server in HTML?

Try this... This will at least get you started. Still not complete, we can't do all the work for you ;-). Then you may want to get into PHP/.NET or other to do the actual upload.

<!DOCTYPE html>
<html>
<body onload="myFunction()">

<input type="file" id="myFile" multiple size="50" onchange="myFunction()">

<p id="demo"></p>

<script>
function myFunction(){
    var x = document.getElementById("myFile");
    var txt = "";
    if ('files' in x) {
        if (x.files.length == 0) {
            txt = "Select one or more files.";
        } else {
            for (var i = 0; i < x.files.length; i++) {
                txt += "<br><strong>" + (i+1) + ". file</strong><br>";
                var file = x.files[i];
                if ('name' in file) {
                    txt += "name: " + file.name + "<br>";
                }
                if ('size' in file) {
                    txt += "size: " + file.size + " bytes <br>";
                }
            }
        }
    } 
    else {
        if (x.value == "") {
            txt += "Select one or more files.";
        } else {
            txt += "The files property is not supported by your browser!";
            txt  += "<br>The path of the selected file: " + x.value; // If the browser does not support the files property, it will return the path of the selected file instead. 
        }
    }
    document.getElementById("demo").innerHTML = txt;
}
</script>

<p><strong>Tip:</strong> Use the Control or the Shift key to select multiple files.</p>

</body>
</html>

Reference: W3School (19-Dec-2017).

How to allow user to upload files to website?

This is where you get into the territory of backend development: You can (for example) use an HTML <input type="file"> to select a file and send it as part of a form, but you will need a server to handle your request. There is a plethora of languages to write backend servers in, some popular ones are node (server-side JS) and PHP.

Here's a tutorial page for file uploads in PHP

And one for file uploads in Node using Express.js

Best way to upload and manage files HTML

You will need to use a server-side language such as PHP to upload files to your server.

A PHP script can be used with a HTML form to allow users to upload files to the server. Initially files are uploaded into a temporary directory and then relocated to a target destination by a PHP script.

Your HTML form would pass the file information to the PHP file, which would upload and process the file onto your server.

Take a look here for more information.

HTML PHP File Upload :: Uploaded File Doesn't Appear On Server

This should be the HTML for your index page. You do not need to use JS to handle file uploads:

<!DOCTYPE html>
<html>
    <body>
          <h2>DIY HTML5 File Uploader</h2>
          <form action="uploader.php" method="post" enctype="multipart/form-data">
                <input type="file" name="uploadFile" id="uploadFile">
                <hr>
                <input type="submit">
            </form>
    </body>
</html>

And this should be the PHP code for uploader.php:

<?php
$target_dir = "uploads/";
$filename = basename($_FILES["uploadFile"]["name"]);
$target_file = $target_dir . $filename;
if (move_uploaded_file($_FILES["uploadFile"]["tmp_name"], $target_dir . $filename)) {
  echo "The file ". $filename . " has been uploaded.";
} else {
  echo "Sorry, there was an error uploading your file.";
}
?>

This code saves your uploaded file in the uploads folder.
If you have any answers or need me to explain the code, please ask.

How to Upload a File to My Server Using HTML