CODEWITHSUNDEEP
javascripthtml
user2962109
user2962109

Reputation: 1

HTML javascript Dropdownlist populated from excel

What I am trying to do is to populate an html dropdown list with values from an excel file. I also need it coded to where it will look in the first field for a value from one dropdown box and then populate another dropdown box.

The excel file will have a list of names which I have coded into the HTML, but this list changes. So I need a way to pull the information from the excel file. The first row will not be displayed in the HTML file as this will be coded into the web page.

Excel file

County City
Davidson Antioch
Davidson Nashville
Rutherford Smyrna

When someone selects the county Davidson from the html form i want it to show the davidson cities in the other dropdown box for them to select. The code I have been using to achieve this without excel is as follows:

<htmL>
<title>
</title>



<body>
<script type="text/javascript">


function configureDropDownLists(county,city) {
        var Davidson = new Array('', 'Antioch', 'Nashville');
        var Rutherford = new Array('', 'Smyrna', 'LaVergne');

        switch (county.value) {
                 case 'Davidson':
                       document.getElementById(city).options.length = 0;
                       for (i = 0; i < Davidson.length; i++) {
                       createOption(document.getElementById(city), Davidson[i], Davidson[i]);
                }
                break;
            case 'Rutherford':
                document.getElementById(city).options.length = 0; 
            for (i = 0; i < Rutherford.length; i++) {
                createOption(document.getElementById(city), Rutherford[i], Rutherford[i]);
                }
                break;
        }

    }

 function createOption(county, text, value) {
        var opt = document.createElement('option');
        opt.value = value;
        opt.text = text;
        county.options.add(opt);
    }
</script>
<tr>
<td>County Name: </td>
<td><select id="county" onchange="configureDropDownLists(this,'city');">
<option value=""></option>
<option value="Davidson">Davidson</option>
<option value="Rutherford">Rutherford</option>
</select></td>
</tr><br>
<tr>
<td>City: </td>
<td><select id="city">
</select></td>
</tr>


</body>
</html>

I am not sure how to get the data from my excel sheet to do the same as I need the first column to be searched and the second column to be displayed with javascript, activeX, or any other coding language that can do the trick in a web page. The excel file will be located on a shared drive along with the web page in the same directory.

Upvotes: 0

Views: 4212

Answers (1)

tymeJV
tymeJV

Reputation: 104785

JavaScript doesn't have access to the file system to be able to do this. Your best bet is to read the information in on the server-side and populate the list like that on page-load. If not page-load and based on a user selection, AJAX will be required to make the seamless transition.

Upvotes: 2

Related Questions