переменная массива javascript, не увеличивающаяся внутри '' тега формы '' в файле ejs - PullRequest
0 голосов
/ 25 апреля 2019

Я рендерим переменные из файла js в файл ejs и хочу создать выпадающий список, когда наведу курсор на кнопку.Но число опций, которые будут перечислены, является динамическим и отображается из файла js.Предположим, что при наведении на кнопку дает нам 3 варианта, таких как 1001, 1002 и 1003. Когда я нажимаю на любой из параметров, я должен получить всплывающую форму для каждого параметра.

Я использую цикл for для обходамассив и создать столько всплывающих форм.Но проблема в том, что цикл for не увеличивается внутри «тега формы».Вся сгенерированная форма относится к данным, хранящимся в нулевом индексе массива.

<div class="dropdown" >
<button  class="dropbtn" >Node Management</button>
<div class="dropdown-content">
  <table>
    <tr>
  <% for(var i in bmsData.node_arr){%>
    <a href="#" class="trigger_popup_fricc" onclick="openForm_node()"><%= bmsData.node_arr[i] %></a>
    <div class="hover_bkgr_fricc" id="myForm_node">
      <form action="/DataRetrieval/bmsnode" class="form-container" method="post">

        <span class="helper"></span>
          <div>
            <h1>Node Configuration</h1>
            <label for="node"><b>Node :<%= bmsData.node_arr[i] %></b></label>
            <input type="text"  name="Node" value="<%= bmsData.node_arr[i] %>" readonly></h1>

                <h2>Temperature</h2>
                <label for="lowerlimit"><b>Lower Limit</b></label>
                <input type="number" placeholder="Enter Lower Limit" name="LLTemperature" value="<%= bmsData.temp_lower[i]%>" required>

                <label for="upperlimit"><b>Upper Limit</b></label>
                <input type="number" placeholder="Enter Upper Limit" name="ULTemperature" value="<%= bmsData.temp_upper[i]%>" required>

                <h2>Relative Humidity</h2>
                <label for="lowerlimit"><b>Lower Limit</b></label>
                <input type="number" placeholder="Enter Lower Limit" name="LLRelativeHumidity" value="<%= bmsData.rh_lower[i]%>" required>

                <label for="upperlimit"><b>Upper Limit</b></label>
                <input type="number" placeholder="Enter Upper Limit" name="ULRelativeHumidity" value="<%= bmsData.rh_upper[i]%>" required>

                <h2>Ambient Light</h2>
                <label for="lowerlimit"><b>Lower Limit</b></label>
                <input type="number" placeholder="Enter Lower Limit" name="LLAmbientLight" value="<%= bmsData.al_lower[i]%>" required>

                <label for="upperlimit"><b>Upper Limit</b></label>
                <input type="number" placeholder="Enter Upper Limit" name="ULAmbientLight" value="<%= bmsData.al_upper[i]%>" required>

            <button type="submit" class="btn">Save</button>
            <button type="button" class="btn cancel" onclick="closeForm_node()">Close</button>
        </div>
      </form>
    </div>
  </tr>
</table>

  <%}%>
</div>
</div>
<script>
function openForm_node()
 {document.getElementById("myForm_node").style.display = "block";}
function closeForm_node() {document.getElementById("myForm_node").style.display = "none";}
</script>

Ожидается: во всплывающей форме для узла 1001 должно отображаться имя узла 1001 и конфигурации узла 1001, аналогично дляузел 1002

Факт: во всплывающей форме для всех узлов отображаются имя узла и конфигурации узла 1001, который хранится в 0-м индексе моего массива

...