I am able to load text data into a javascript array in .js file but not inside html

Question

I need to load the text file data into a javascript array and define a dynamic form using html.

I tried below code for extracting data from text file and to store in a javascript array and it works as long as it is in .js file

var fs = require('fs');
var textByLine = fs.readFileSync('123.txt').toString().split("\n");
console.log(textByLine);

but when I embed it inside my html file this doesn't work.

below is my html code. for now I am just forming an array with months but i need to replace it with array taken from the text file.

<html>
<head>
<title></title>
<META NAME="DESCRIPTION" CONTENT="">
<META NAME="KEYWORDS" CONTENT="">


<script language="javascript">
var dt=new Date();
var dt_month=dt.getMonth() +1;
//alert(dt_month);
function addOption(selectbox,text,value )
{
    var optn = document.createElement("OPTION");
    optn.text = text;
    optn.value = value;
    selectbox.options.add(optn);
}

function addOption_list(){
var month = new Array("January","February","March","April","May","June","July","August",
"September","October","November","December");
for (var i=0; i < month.length;++i){
addOption(document.drop_list.Month_list, month[i], month[i]);
document.drop_list.Month_list.options[i].selected=true;
}
}
</script>
</head>

<body onLoad="addOption_list()";>
You can see the view-> Source of this page. 
<br><br>
<FORM name="drop_list" action="yourpage.php" method="POST" >

<SELECT  NAME="Month_list">
<Option value="" >Month list</option>
</SELECT>
</form>


</body>
</html>

I gave the 3 line code which is working independently as a .js file inside addOption_list function in above code and it doesn't work. Appreciate help on this.

Thanks in advance

You'll have to write the array to the document served to the client, or have an endpoint that, when pinged, returns the array — CertainPerformance
– CertainPerformance, Commented Apr 16, 2019 at 5:17
fs.readFileSync is a Node-only thing, does not exist in browsers. — Amadan
– Amadan, Commented Apr 16, 2019 at 5:18
<script language="javascript"> must be a while since you've written a web page - the language attribute was deprecated in HTML 4.0 (1997) :p — Jaromanda X
– Jaromanda X, Commented Apr 16, 2019 at 5:22
sorry I was a bit naive to in this.....do we have a pseudo code please? — Kishan
– Kishan, Commented Apr 16, 2019 at 5:26

David · Accepted Answer · 2019-04-16 06:01:03Z

1

The FileSytem (fs) module is for NodeJS applications so needs to be in .js file. If you want to load the file into your html you can use Ajax instead. This may work:

<script>
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      myFunction(this.responseText);
    }
  };
  xhttp.open("GET", "123.txt", true);
  xhttp.send();
}

function myFunction(data) {
  var textByLine = data.split("\n");
  console.log(textByLine);
}

loadDoc();

</script>

answered Apr 16, 2019 at 6:01

David

843 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Kishan Over a year ago

Thanks David for the code. I added above function in my script and tried to push elements of textByLine to my default array. it's not happening. I am not getting any error but it's not taking elements dynamically into the drop down from that array. how can we debug this kind of code ? Appreciate your time and effort thanks a bunch

David Over a year ago

Follow this: stackoverflow.com/questions/9895082/…

Collectives™ on Stack Overflow

I am able to load text data into a javascript array in .js file but not inside html

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related