Не могу понять что я делаю не так с select?

Question

[holllop]

У меня есть select

<label for="department">Отдел:</label>
<select id="department" name="department" required>
</select>

Чего я хочу ? Я хочу чтобы варианты в этот select брались из JSON который мне доступен по ссылке.
Мои варианты как я пытался сделать:

fetch('http://:3000/departament')
  .then(response => {
    if (!response.ok) {
      throw new Error('Ошибка загрузки данных');
    }
    return response.json();
  })
  .then(data => {
    const options = data.map(item => {
      const option = document.createElement('option');
      option.value = item.departament; // значение option
      option.textContent = item.departament; // текст варианта
      return option;
    });
    departmentSelect.append(...options);
  })
  .catch(error => {
    console.error(error);
    // Обработать ошибку
  });

и ещё один

const departmentSelect = document.querySelector('#department');

// Загрузить данные с сервера
fetch('https://example.com/departments')
  .then(response => {
    // Проверить код ответа сервера
    if (!response.ok) {
      throw new Error('Ошибка загрузки данных');
    }
    // Вернуть промис с результатом разбора тела ответа в формате JSON
    return response.json();
  })
  .then(data => {
    // Создать варианты выбора для списка
    const options = data.map(department => {
      const option = document.createElement('option');
      option.value = department.id; // значение option
      option.textContent = department.name; // текст варианта
      return option;
    });
    // Добавить варианты к списку
    departmentSelect.append(...options);
  })
  .catch(error => {
    console.error(error);
    // Обработать ошибку
  });

На всякий случай укажу данные в JSON

{
departament: "СО"
},
{
departament: "ГО"
},
{
departament: "ОТПГ"
},
{
departament: "ЭМО"
},
{
departament: "ТЭО"
},итд

И вот честно не понимаю что я делаю не так ?

Comments

[szQocks]

у тебя нет в json у departament.id и например departament.name

[imko]

Селект не self-closing

Answer 1

[holllop]

szQocks, был прав я делал скрипт несмотря что у меня нет значений departament.id и departament.name
Так что правильный скрипт выглядит вот так

const departmentSelect = document.querySelector('#department');

fetch('http://example.com/departament')
  .then(response => {
    if (!response.ok) {
      throw new Error('Ошибка загрузки данных');
    }
    return response.json();
  })
  .then(data => {
    const options = data.map(item => {
      const option = document.createElement('option');
      option.value = item.departament; // значение option
      option.textContent = item.departament; // текст варианта
      return option;
    });
    departmentSelect.append(...options);
  })
  .catch(error => {
    console.error(error);
    // Обработать ошибку
  });