Подключите FireBase к списку опций HTML - PullRequest
0 голосов
/ 01 марта 2019

Моя система подключена к базе данных Firebase, и я пытаюсь позволить администратору добавлять курсы в систему, включая ее имя и код в дополнение к инструктору.
(Например, Имя: введение в разработку программного обеспечения, Код: SE101).

Вот мой код для списка

<form class="pad">
  <fieldset>
    <legend>Please select the Course and the Instructor</legend>
    <p>
      <label>Course</label>
      <select id = "courseList">
        <option value = "1">Please select</option>
        <option value = "CMPE101">CMPE101</option>
        <option value = "CMPE102">CMPE102</option>
        <option value = "CMPE103">CMPE103</option>
        <option value = "CMPE104">CMPE104</option>
      </select>
    </p>
  </fieldset>
</form>

А вот часть кода, которая соответствует добавлению курсов в другой HTML-файл:

<form>
  <fieldset>
    <legend>Text input</legend>
    <p>
      <label>Course Name</label>
      <input type = "text" id = "name" />
    </p>
    <p>
      <label>Course Code</label>
      <input type = "text" id = "code" />
    </p>
    <button type="button">Submit</button>
  </fieldset>
</form>


Теперь я хочу, чтобы пользователь отправлял курс и его код, который должен быть отправлен в базу данных Firebase, сохранен там и затем добавлен в список опций в первом коде.
Я попробовал следующее в коде javascript, курсы добавляются в базу данных под случайно сгенерированным ключом, но они не добавляются в список опций в первом коде.

База данных: firebase

let DB = firebase.database();

let newCourseList = document.getElementById('courseList');

function addcourse(){
    let newcoursename = document.getElementById("name").value;
    let newcoursecode = document.getElementById("code").value;
    let newcourse = {
        name: newcoursename,
        code: newcoursecode
    }
    course = DB.ref('/courses').push(newcourse);
    firebase.database().ref().child("courses").orderByChild("name").equalTo(newcoursename).once("value", function (snapshot) {
        snapshot.forEach(function(childSnapshot) {
          let newname = childSnapshot.val().name;
          let newcode=childSnapshot.val().code;
          console.log(newname, newcode);
        });
      });
  addcoursetoList(newname, newcode);
    }
  function addcoursetoList(nn, nc){
  let newoption = document.createElement('option');
  newoption.innerHTML = nc;
  newoption.setAttribute('value', nc);
  newCourseList.appendChild(newoption); }

Файл js включен в оба файла html.Я попытался добавить второй код, который я написал здесь, в тот же HTML-файл первого, но он также не работал, поэтому я держал их отдельно.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...