Как открыть файл на основе записей формы HTML

Question

У меня есть два отдельных поля с раскрывающимся списком, одно для пользователя, а второе для данных.Тогда у меня есть кнопка, которая в идеале будет работать как вывод выбора из двух выпадающих списков.Форма должна получить файл, который имеет отношение к выбору.Открываемый файл всегда имеет следующий формат, поэтому я надеялся использовать его: _.csv

Вот упрощенная версия того, что я использую:

<td align="left"><!-- User/data selector -->
  <table border="0">
    <tbody>
      <tr>
        <th align="left">User:</th>
        <td>
        <select name="users" id="users">
        <option value="user1">User 1</option>
        <option value="user2">User 2</option>
        <option value="user3">User 3</option>
        </select>
        </td>
      </tr>
      <tr>
        <th align="left">Data:</th>
        <td>
        <select name="data" id="data">
        <option value="data1">Data 1</option>
        <option value="data2">Data 2</option>
        <option value="data3">Data 3</option>                    
        </select>
        </td>
      </tr>
      <tr>
        <td></td>
        <td><input type='button' value='Generate Report' onClick='newWindow();'/></td>
      </tr>
    </tbody>
  </table>

Итакя борюсь с тем, чтобы знать, что написать в функции newWindow(), чтобы получить необходимый выбор «Пользователь» и «Данные», чтобы получить правильный файл.Вы можете помочь?

Очень ценится!

Answer 1

Вы можете получить значения этих <select> полей с помощью document.getElementById(id).value, где id будет data или users, чтобы составить имя файла CSV.

Функция openWindow может выглядеть следующим образом:

function openWindow(){
    var users = document.getElementById('users').value;
    var data = document.getElementById('data').value
    var fileName =  users + "_" + data + ".csv";
    var pathToFiles = "/whateverdirectory/";

    window.open(pathToFiles + fileName, fileName);
}

Кроме того, помните, что не следует использовать <table> s для макета , они предназначены для отображения табличных данных.Вместо этого рекомендуется использовать <div> s.

Вы также можете найти эту запись в блоге полезной: Использование метода window.open .