Создать список флажков из возвращенного массива

В настоящее время у меня есть файл JavaScript, который продуцирует массив:Создать список флажков из возвращенного массива

var express = require('express'); 
var router = express.Router(); 
var adb = require('./adb.js'); 

router.get('/', function(req, res, next) { 
    adb.devices().then(function(devices) { 
     var promises = new Array(); 
     for (var i = 0; i < devices.length; i++){ 
      promises.push(adb.checkBattery(devices[i])); 
     } 
     Promise.all(promises).then(function(availableDevices) { 
      res.render('devices', {output: 'Available Devices: ' + availableDevices}); 
     }); 
    }); 
}); 

module.exports = router;

Как я могу получить этот массив, а затем создать флажок для каждого элемента, а затем отображать его на веб-страница? Мой файл index.ejs выглядит так, и я хочу заменить контрольный список животных именами устройств, возвращаемых массивом.

<!DOCTYPE html> 
<html> 
<head> 
    <title><%= title %></title> 
    <link rel='stylesheet' href='/stylesheets/style.css' /> 
</head> 
<body> 
<% include templates/header.ejs %> 
<h1><%= title %></h1> 

<fieldset> 
    <legend>Available Devices</legend> 
    <input type="checkbox" name="animal" value="Cat" />Cats <br /> 
    <input type="checkbox" name="animal" value="Dog" />Dogs<br /> 
    <input type="checkbox" name="animal" value="Bird" />Birds<br /> 
</fieldset> 
<br> 
<fieldset> 
    <legend>Enter Parameter</legend> 
    <input type="text" id="parameter" placeholder="e.g. id=com.cmplay.tiles2"> 
</fieldset> 
<br> 
<fieldset> 
    <legend>Select Test</legend> 
    <button id="devices" class="float-left submit-button" >Display Devices</button> 
    <button id="openApp" class="float-left submit-button" >Open Application</button> 
    <button id="closeApp" class="float-left submit-button" >Close Application</button> 
    <button id="openBrowser" class="float-left submit-button" >Open Browser</button> 
    <button id="closeBrowser" class="float-left submit-button" >Close Browser</button> 
    <button id="pull" class="float-left submit-button" >Pull File</button> 
    <button id="push" class="float-left submit-button" >Push File</button> 
    <button id="install" class="float-left submit-button" >Install Application</button> 
    <button id="uninstall" class="float-left submit-button" >Uninstall Application</button> 
</fieldset> 

<script type="text/javascript"> 
    var test = document.getElementById("test"); 
    var method = document.getElementById("method"); 
    var parameter = document.getElementById("parameter"); 
    var device = document.getElementById("myButton1"); 
    document.getElementById("devices").onclick = function() { 
     location.href = "devices?" + "&" + parameter.value; 
    }; 
    document.getElementById("openApp").onclick = function() { 
     location.href = "openApp?" + "&" + parameter.value; 
    }; 
    document.getElementById("closeApp").onclick = function() { 
     location.href = "closeApp?" + "&" + parameter.value; 
    }; 
    document.getElementById("openBrowser").onclick = function() { 
     location.href = "openBrowser?" + "&" + parameter.value; 
    }; 
    document.getElementById("closeBrowser").onclick = function() { 
     location.href = "closeBrowser?" + "&" + parameter.value; 
    }; 
    document.getElementById("pull").onclick = function() { 
     location.href = "pull?" + "&" + parameter.value; 
    }; 
    document.getElementById("push").onclick = function() { 
     location.href = "push?" + "&" + parameter.value; 
    }; 
    document.getElementById("install").onclick = function() { 
     location.href = "install?" + "&" + parameter.value; 
    }; 
    document.getElementById("uninstall").onclick = function() { 
     location.href = "uninstall?" + "&" + parameter.value; 
    }; 
</script> 

</body> 
</html>

источник

2017-01-27 rrain

Создайте контейнер внутри fieldset держать ваши флажков

<fieldset> 
    <legend>Available Devices</legend> 
    <div id='devices'> 
     <input type="checkbox" name="animal" value="Cat" />Cats <br /> 
     <input type="checkbox" name="animal" value="Dog" />Dogs<br /> 
     <input type="checkbox" name="animal" value="Bird" />Birds<br /> 
    </div> 
    </fieldset>

итерацию через массив и добавить флажок для каждого элемента

var express = require('express'); 
var router = express.Router(); 
var adb = require('./adb.js'); 

router.get('/', function(req, res, next) { 
    adb.devices().then(function(devices) { 
     var promises = new Array(); 
     for (var i = 0; i < devices.length; i++){ 
      promises.push(adb.checkBattery(devices[i])); 
     } 
     Promise.all(promises).then(function(availableDevices) { 
      res.render('devices', {output: 'Available Devices: ' + availableDevices}); 
     }); 
     //CREATE YOUR CHECKBOXES 
     var container = document.getElementById('devices'); 
     for (var i in promises) { 
      //GET YOUR DEVICE OBJECT 
      var device = promises[i]; 
      //CREATE THE CHECKBOX 
      var checkbox = document.createElement('input'); 
      checkbox.type = "checkbox"; 
      checkbox.name = "name"; //GET NAME FROM YOUR OBJECT 
      checkbox.value = "value"; //GET VALUE FROM YOUR OBJECT 
      checkbox.id = "id"; //GET ID FROM YOUR OBJECT 
      //CREATE THE LABEL 
      var label = document.createElement('label') 
      label.htmlFor = "id"; //GET ID FROM YOUR OBJECT 
      label.appendChild(document.createTextNode('Label Text Here')); 
      //ADD THE CHECKBOX AND LABEL TO THE CONTAINER 
      container.appendChild(checkbox); 
      container.appendChild(label); 
     } 
    }); 
}); 

module.exports = router;

источник

2017-01-27 15:19:39

ли вторая часть кода идти наряду с массив в моем файле javascript или в моем html-файле? Если im использует javascript-файл, мне также нужно создать скрипт, а затем исправить его? "" – rrain

Вы тоже можете это сделать. Я просто обновил ответ, чтобы сохранить его как часть вашей функции ответа. –

Итак, я добавил контейнер и изменил код в index.js на тот, который вы указали. Теперь я получаю сообщение об ошибке «throw new TypeError (« Router.use() требует функции промежуточного слоя, но получил «+ gettype (fn)); и "TypeError: Router.use() требует функции промежуточного слоя, но получает объект" – rrain

Создать список флажков из возвращенного массива

ответ

Смежные вопросы