在同一頁面上單擊下拉按鈕以從數據庫中輸出值

Question

抱歉，我不會上載整個代碼以避免竊，因為這是我的uni項目，但我只想問一個簡單的問題。 所以基本上我有一個存儲傳感器數據的數據庫。 然后，我有一個Python文件和html文件。 在Python文件中，我導入了以下庫和模塊：cherrypy，sqlite3和jinja2。 所以我通過python用代碼連接數據庫，例如select * from ...然后在html中，我有代碼來設置下拉按鈕的樣式，這是下拉按鈕本身：

    <div class="dropdown">
        <button onclick="sound_hist()" class="dropbtn">Previous sound data</button>
        <div id="soundData" class="dropdown-content">
            {% for d in dates %}
                <a href="">{{d}}</a>
            {% endfor %}
        </div>
    </div>

它會在我的主頁上創建一個下拉按鈕，並且單擊該按鈕時，有4個選項可供選擇，即4個日期。 但是問題是，我不確定是否有可能做這樣的事情，因此，當選擇了特定的日期（即單擊了按鈕）后，數據庫中的數據會顯示在同一頁面上嗎？ 數據庫本身有4列：行，日期，時間和數據。 因此，我想單擊下拉菜單中的任何選項（日期），並且在同一頁面上的按鈕旁邊單擊時，我將能夠看到該日期傳感器的時間和數據。 但是目前，我懷疑這是否可能做到。 有人可以幫忙嗎？

Answer 1

可以使用一些簡單的Javascript完成此操作，如下面的示例所示，但是數據必須包含在Javascript中。 在您的情況下，這可能是不可能的。

我建議查看CherryPy網站上的教程。 如果您想從服務器獲取數據，那么Ajax和React教程可能是最有用的。

<html>
<body>
  <script>
    var sensorData = {
      Jan1: "January 1st Data",
      Jan2: "January 2nd Data",
      Jan3: "January 3rd Data"
    };

    function updateText() {
      var options = document.getElementById('dates');
      var display = document.getElementById('display')
      display.innerHTML = sensorData[options.value];
    }
  </script>

  <select id="dates" onchange="updateText()">
    <option value="Jan1">January 1</option>
    <option value="Jan2">January 2</option>
    <option value="Jan3">January 3</option>
  </select>

  <div id="display">Display Data Here</div>
</body>
</html>

在同一頁面上單擊下拉按鈕以從數據庫中輸出值

問題描述

1 個解決方案

解決方案1
0 2018-02-22 16:38:34

在同一頁面上單擊下拉按鈕以從數據庫中輸出值

問題描述

1 個解決方案

解決方案1 0 2018-02-22 16:38:34

解決方案1
0 2018-02-22 16:38:34