Javascript (html): How to search a string in local file (like .csv, .txt, etc)

Question

I would like to search and show a data from a local file like csv or txt in my html. Ex. open and read "file.cvs" = (1;a bc;2;def;3;gh i). If I input value "1", a text "a bc" will be shown.

<html>

<head><meta charset="UTF-8"></head>

<body onload="form1.reset();">

    <form id="form1">
      <fieldset>
      <label for="code">Code:</label>
      <input type="text" id="code" maxlength="6" required="">
      <p id="output">Text will be shown here!<p/>
      <input type="button" id="button" value="Ok">
      </form>
      </fieldset>
    </form>

<script>
    button.onclick = function() {
    document.getElementById("output").innerHTML = ????
</script>

</body>
</html>

Thanks in advance

Does this answer your question? [Read a local text file using Javascript](https://stackoverflow.com/questions/27522979/read-a-local-text-file-using-javascript) — Randy Casburn, Dec 18 '20 at 23:26
Not entirely, I've also some code to read files: or
but what I mainly need it's to search for a text and return a result within the file. Thanks — Camboyano Dominador, Dec 19 '20 at 17:55
this: "_I mainly need it's to search for a text and return a result within the file_" is unclear to me. I think you mean you want to search for text from within the file you've read with that code. But I don't know what you mean by "return a result with the file". If you mean write to that same file, you cannot do that. You can write to a file, but it will be a download the user will have to initiate. — Randy Casburn, Dec 19 '20 at 18:07
Sorry for my bad explanation, I need a HTML to open and search data from input from a local file like .txt or .csv and return the value in HTML. I know how open a local file from HTML and show in the page but it will show all data and I only want an specifically data like ex: search for a name Adam in the database.txt and show me as result 26 yo, something like that. Thanks Randy for your replies. — Camboyano Dominador, Dec 20 '20 at 01:07

score 0 · Accepted Answer · answered Dec 20 '20 at 01:24

So based upon the clarification (thanks), assuming you have already read the file into a variable named csv as a starting point.

With this stated requirement from the question:

Ex. open and read "file.cvs" = (1;a bc;2;def;3;gh i). If I input value "1", a text "a bc" will be shown.

The following code demonstrates how to create an Object Literal that can be used to filter on the key as you've requested.

Split the string on the ; character
Use reduce to create the object literal (key/value pairs)
Prompt for input
Use input number as the key to look up in the object literal
Replace the DOM content with the value referenced by the key

const csv = "1;a bc;2;def;3;gh i";

const hash = csv.split(';').reduce((acc, n, idx, array) => {
  if (idx % 2) {
    acc[array[idx - 1]] = n;
  } else {
    acc[array[idx]] = '';
  }
  return acc;
}, {});

console.log(hash);
let input = prompt("enter 1,2 or 3");
document.getElementById('output').textContent = hash[input];

<div id="output">Output will go here</div>

Performing the other search you mentioned in the comments requires sample data before an answer can be provided for that one.

Javascript (html): How to search a string in local file (like .csv, .txt, etc)

1 Answers1