Open and display a .txt file on div on user's computer

Asked May 01 '15 at 07:29

Active May 02 '15 at 15:30

Viewed 141 times

I am trying to add a functionality where a user can browse a file and display the content of the file on the div.

<!DOCTYPE html>
<html>
    <head>
    </head>
<body>
    <input id='inpFile' type='file'>
    <button id='submit'>Submit</button>  
    <div id='content'>Hello</div>
</body>
</html>

JS:

$('#submit').click(function() {
    $.get($('#inputFile').val(), function(data) {
        $('#content').html(data);
    });
}

Nothing is getting updated in the div element and no error is returned. Please suggest.

UPDATE:

I recently discovered that $.get() basically does an http request. But my file is present locally in the system, so is the reason above JS code is not working.

But I can't use HTML5 File or FileReader API as I am working on IE-8, it doesn't support HTML5.

So should I copy the file to the server and then use $.get() to get the file contents to div.

Please suggest.

edited May 02 '15 at 15:30

asked May 01 '15 at 07:29

Ejaz

1,504
3
25
51

`get` is for making an HTTP request to a URL, not for reading files from the file system – Quentin May 01 '15 at 07:34
2

http://jsfiddle.net/moogs/cfd56bhh/1/ – Miguel Mota May 01 '15 at 07:38
@GregL question is closed so can't answer – Miguel Mota May 01 '15 at 07:43
@Moogs — It's a duplicate question. You can answer the duplicate if you think your answer is better then the ones already there. – Quentin May 01 '15 at 07:43
@Quentin the duplicates answer the question – Miguel Mota May 01 '15 at 07:44

Open and display a .txt file on div on user's computer

0 Answers0