uploading files javascript code example

Example 1: javascript upload file button

<input id='fileid' type='file' hidden/>
<input id='buttonid' type='button' value='Upload MB' />

Example 2: javascript upload file button

document.getElementById('buttonid').addEventListener('click', openDialog);

function openDialog() {
  document.getElementById('fileid').click();
}

Example 3: how to use input type file and show selected file on screen

updateList = function() {
  var input = document.getElementById('file');
  var output = document.getElementById('fileList');

  output.innerHTML = '<ul>';
  for (var i = 0; i < input.files.length; ++i) {
    output.innerHTML += '<li>' + input.files.item(i).name + '</li>';
  }
  output.innerHTML += '</ul>';
}

Example 4: how to use input type file and show selected file on screen

<input type="file" name="file" id="file" multiple 
       onchange="javascript:updateList()" />
<br/>Selected files:
<div id="fileList"></div>

Tags:

Html Example

Related