Read text file from SD card and display using rip in phone
I have an example.txt sdcard file and I want to display it with a rip in the phone. I am very new to android and phone, please help. Here is my example.txt file:
<h2>This file is in sdcard</h2>
Here is my phonegap.java
package com.example.phonegap;
import org.apache.cordova.DroidGap;
public class Phonegap extends DroidGap{
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.loadUrl("file:///android_asset/www/myfile.html");
}
}
and here is myfile.html at www:
<!DOCTYPE html>
<html>
<head>
<title>FileReader Example</title>
<script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
<script type="text/javascript" charset="utf-8">
// Wait for PhoneGap to load
//
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
// PhoneGap is ready
//
function onDeviceReady() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
}
function gotFS(fileSystem) {
fileSystem.root.getFile("file:///sdcard/example.txt", {create: true}, gotFileEntry, fail);
}
function gotFileEntry(fileEntry) {
fileEntry.file(gotFile, fail);
}
function gotFile(file){
readDataUrl(file);
readAsText(file);
}
function readDataUrl(file) {
var reader = new FileReader();
reader.onloadend = function(evt) {
console.log("Read as data URL");
console.log(evt.target.result);
};
reader.readAsDataURL(file);
}
function readAsText(file) {
var reader = new FileReader();
reader.onloadend = function(evt) {
console.log("Read as text");
console.log(evt.target.result);
};
reader.readAsText(file);
}
function fail(evt) {
console.log(evt.target.error.code);
}
</script>
</head>
<body>
<h1>Example</h1>
<p>Read File</p>
</body>
</html>
source to share
I also faced the same problem. I don't think the API document in Phonegap is right, so I called JavaScript: The Definitive Guide, I found two key points:
-
the location of the file I'm ready to read. -> I found the default parent path: / mnt / sdcard. The file "/mnt/sdcard/temp/test.txt" was written as
fileSystem.root.getFile("temp/test.txt", null, gotFileEntry, fail)
-
after
reader.readAsText(file)
, just usingelement.innerHTML = reader.result
can't render the result in HTML file. so I add a callback:reader.onload = function(){ element.innerHTML = reader.result }
After setting up two parts, my code works!
StackOverflow has a very strict upload format policy so I can't upload the exact code. But you can contact me to request a code.
source to share
I am assuming example.txt is in the root of the SD card (not in the folder). Then change the following code,
function gotFS(fileSystem) {
fileSystem.root.getFile("file:///sdcard/example.txt", {create: true}, gotFileEntry, fail);
}
to
function gotFS(fileSystem) {
fileSystem.root.getFile("example.txt", {create: true}, gotFileEntry, fail);
}
And try using alert in the below function,
function readAsText(file) {
alert("readAstext");
var reader = new FileReader();
reader.onloadend = function(evt) {
console.log("Read as text");
console.log(evt.target.result);
alert("content : "+evt.target.result);
};
reader.readAsText(file);
}
If it doesn't work add below code to your body tag in HTML
<body onload='onLoad();'>
Let me know the problems you may face. Thank,
source to share