0

I try to open a file using jQuery. Here is my HTML,

<button onclick='load();'>load</button>

Here is my js code:

function load() {
  var fileSelector = $('<input id="load" type = "file" multiple />');
  fileSelector.click();
  //code here to get the files ...
}

Now I want to get the loaded files, what should I do?

Shiladitya
  • 12,003
  • 15
  • 25
  • 38
Benson
  • 275
  • 2
  • 6
  • 12
  • you can't do that unless otherwise you are using a backend language such as php,asp.net etc.. – Amit Joki Mar 07 '14 at 16:14
  • In modern browsers you can read a file that's been interactively selected by the user but you cannot arbitrarily set the file yourself (for obvious reasons ..) – Alex K. Mar 07 '14 at 16:22
  • The code to get the files does not necessarily be exactly there. I just want to know how I can get the files. – Benson Mar 07 '14 at 16:22
  • See http://stackoverflow.com/questions/750032/reading-file-contents-on-the-client-side-in-javascript-in-various-browsers – Alex K. Mar 07 '14 at 16:23
  • What exactly do you mean by "get the loaded files"? – Nico Haase Apr 25 '19 at 07:23

3 Answers3

6

The HTML5 File Api (http://dev.w3.org/2006/webapi/FileAPI/) allows opening files, however the files must be selected by the User for security.

If you need to open a file without user interaction, then it is necessary to do this on the server side with a language like PHP for example.

Leonardo Delfino
  • 1,488
  • 10
  • 20
1

Here's my solution I used the file type input and then use the Jquery trigger function to trigger the click event for file input.

$(function(){
  $("#btnFile").click(function(){
    $("#file").trigger("click");
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

 <input id="file" type="file" hidden/>
 <button id="btnFile">Click Me</button>
John Kenneth larbo
  • 11
  • 3
  • Can you explain that further? How do you "get the loaded files" using that code? Why do you need to trigger a click on a hidden field? – Nico Haase Apr 25 '19 at 07:25
  • My apologies, actually I searched for a problem that somewhat similar to this, what I'm trying to do is to open the select file dialog using file input in jquery and that is my solution for that. I used the keyword "Open file input using jquery" for searching and I thought this post is related to my search and then realized I was wrong for posting this answer. – John Kenneth larbo Apr 25 '19 at 09:30
  • Please add all such explanation to the answer itself, not to the comment section – Nico Haase Apr 25 '19 at 09:37
0

You can open JSON file with JavaScript and use fetch('json_file patch') .

otejiri
  • 1,017
  • 6
  • 20
meysam
  • 1
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Dec 06 '21 at 01:47