How to create list by importing txt file in javascript?

Question

I have a department.txt file that contains departments:

Chemistry
Physics
Mathematics
Other

and i want to create a drop down list <select> by importing this file in my HTML. How can i do it using Javascript? There are 50+ departments in file , so creating <option> for every department will not be a good idea.

As far as I know javascript will not let you access the file system, so you will not be able to open department.txt with JS. — angelcool.net
– angelcool.net, Commented Nov 6, 2015 at 5:18
@ShailendraSharma yes. I have tried using php to import the file and create list inside javascript. That doesn't work. — Salman Zafar
– Salman Zafar, Commented Nov 6, 2015 at 5:20
@angelcool.net Alright. is there anyother way to populate the list? like using AJAX or any other mehtod? — Salman Zafar
– Salman Zafar, Commented Nov 6, 2015 at 5:22

Rayon · Accepted Answer · 2015-11-06 05:25:18Z

1

To read txt file, you need to make an ajax call to department.txt and iterate departments like this:

function readFile() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      var res = xhttp.responseText;
      res = res.split('\n');
      var html = '<select name="department">';
      res.forEach(function(item) {
        html += '<option value="' + item + '">' + item + '</option>';
      });
      html += '</select>';
      document.body.innerHTML = html;
    }
  };
  xhttp.open("GET", "department.txt", true);
  xhttp.send();
}
readFile();

answered Nov 6, 2015 at 5:25

Rayon

36.6k5 gold badges54 silver badges78 bronze badges

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

Collectives™ on Stack Overflow

How to create list by importing txt file in javascript?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related