I am working on a script to read and search for keywords in a text file that is uploaded to a website. I have an idea about how to read a string and report the number of occurrences of a word using RegEx, but I can't figure out how to access the text from fileReader once it is loaded. I want to call this script by clicking on the "Start Coding" button after the FileReader has done its work. I created a function to make this work, but I can't figure out how to access the file reader text. Thanks for your help!
I got the script for the fileReader from here How to read text file in JavaScript
<!DOCTYPE html>
<html>
<head>
<title>Read File (via User Input selection)</title>
<button onclick="myFunction()">Start Coding</button>
<script type="text/javascript">
alert ("Please insert your text in the box below and we will begin searching")
var reader; //GLOBAL File Reader object for demo purpose only
/**
* Check for the various File API support.
*/
function checkFileAPI() {
if (window.File && window.FileReader && window.FileList && window.Blob) {
reader = new FileReader();
return true;
} else {
alert('The File APIs are not fully supported by your browser. Fallback required.');
return false;
}
}
/**
* read text input
*/
function readText(filePath) {
var output = ""; //placeholder for text output
if(filePath.files && filePath.files[0]) {
reader.onload = function (e) {
output = e.target.result;
displayContents(output);
};//end onload()
reader.readAsText(filePath.files[0]);
}//end if html5 filelist support
else if(ActiveXObject && filePath) { //fallback to IE 6-8 support via ActiveX
try {
reader = new ActiveXObject("Scripting.FileSystemObject");
var file = reader.OpenTextFile(filePath, 1); //ActiveX File Object
output = file.ReadAll(); //text contents of file
file.Close(); //close file "input stream"
displayContents(output);
} catch (e) {
if (e.number == -2146827859) {
alert('Unable to access local files due to browser security settings. ' +
'To overcome this, go to Tools->Internet Options->Security->Custom Level. ' +
'Find the setting for "Initialize and script ActiveX controls not marked as safe" and change it to "Enable" or "Prompt"');
}
}
}
else { //this is where you could fallback to Java Applet, Flash or similar
return false;
}
return true;
}
/**
* display content using a basic HTML replacement
*/
function displayContents(txt) {
var el = document.getElementById('main');
el.innerHTML = txt; //display output in DOM
}
function myFunction() {
alert("We will start by highlighting all the required search terms then we will being our search by looking for the instances of the word 'pilot'")
var count = (txt.match(/program/g) || []).length
alert ("your word occured " + count + " times.")
}
</script>
</head>
<body onload="checkFileAPI();">
<div id="container">
<input type="file" onchange='readText(this)' />
<br/>
<hr/>
<h3>Contents of the Text file:</h3>
<div id="main">
...
</div>
</div>
</body>
</html>
Update
I figured out how to connect to the documents that were loaded onto the site thanks to NinjaM and some more research. I had to connect to the ID and used the .innerHTML method to connect with the uploaded document. Everything is working fine, except I now have a new problem with getting my loop to work properly.
I want to have users upload a document to this site and then have them click through a series of buttons that search for keywords in the document. I work with an organization that is coding documents on climate change and I'm trying to speed up the process. Typically, a person reads through the documents and then uses control-f to search for certain climate change keywords. If the keywords are in the document in the right context, then the user makes a note of it in our database. This site will automate that process and reduce some of the risk that people will not search for the appropriate term or won't search all of the terms.
I have a series of RegEx expressions that I would like to put through a loop and search for in the document. I made the loop and the expressions but I would like for my loop to start over again after it has search through each item in the array. For example, once it has searched the document for the key word pilot I would then like for it to start at the beginning again and search the whole document for the keyword project. Right now the search looks for pilot in the document and then once it finds the last instance of pilot, it moves on to project. This is the portion of the code that I would like help to fix :
function windowFind(){
var pilotWords = ["pilot","project"];
for (var i = 0; i < pilotWords.length; i++) {
("Find -> are = " + window.find(pilotWords[i]))}
}
You can check out a basic version of the site on github https://calebdow.github.io/ You will have to find upload a test file