Форум

mcmega · #1 (**permalink**) 28.10.2017, 18:51

Всем привет!
Подскажите, есть массив объектов вида:

var ssidObjs = [
    {"ssid":"TP-Link_6260","rssi":-66,"channel":1},
    {"ssid":"TP-LINK_71","rssi":-81,"channel":1}
]

Разобрал массив на объекты и вывел в select

ssidObjs.forEach(function(elem) {
    option = document.getElementById('staSSIDSelect');
    option.options[option.options.length] = new Option(elem.ssid + ' (' + elem.rssi + 'dBm, ch' + elem.channel + ')', elem.ssid);
});

<select id="staSSIDSelect" value="sta_ssid" onchange="ssidChange()">
    <option disabled="">-----</option>
    <option value="">Hidden Network</option>
    <option>Данные из объекта 1</option>
    <option>Данные из объекта 2</option>
</select>

Как сделать так, чтоб добавляемые option всегда были сначала списка, а не добавлялись в конце?
И вообще как правильно такую задачу сделать (вывести данные из массива объектов в select)?
Помогите пожалуйста!

рони · #2 (**permalink**) 28.10.2017, 19:12

mcmega,

<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src='https://code.jquery.com/jquery-latest.js'></script>
  <script>
  $(function ()
{
function ssidChange()
{

}
var data = [
    {"ssid":"TP-Link_6260","rssi":-66,"channel":1},
    {"ssid":"TP-LINK_71","rssi":-81,"channel":1}
]
, select = $('<select/>', {id : "staSSIDSelect", change : ssidChange});
$.each(data,function() {
    $('<option/>', {
        val:  this.ssid,
        text: this.ssid + " ("+this.rssi+"dBm)"
    }).appendTo(select);
});

$('.result_block').append(select);
})


  </script>
</head>

<body>
   <div class="result_block"></div>
</body>

</html>

mcmega · #3 (**permalink**) 28.10.2017, 19:27

Спасибо! Но нужно на чистом js, без внешних библиотек.

рони · #4 (**permalink**) 28.10.2017, 20:08

mcmega,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">

</head>

<body>
<select id="staSSIDSelect" value="sta_ssid" onchange="ssidChange()">

    <option disabled="">-----</option>
    <option value="">Hidden Network</option>
</select>
<script>
 var ssidObjs = [
    {"ssid":"TP-Link_6260","rssi":-66,"channel":1},
    {"ssid":"TP-LINK_71","rssi":-81,"channel":1}
],
select = document.getElementById('staSSIDSelect');
ssidObjs.forEach(function(elem,i) {
    select.add(new Option(elem.ssid + ' (' + elem.rssi + 'dBm)', elem.ssid),i);
});
select.selectedIndex = 0;
</script>

</body>
</html>

mcmega · #5 (**permalink**) 28.10.2017, 20:19

Спасибо!!! Все отлично заработало!

Форум

Справочник

Discord чат

Курсы javascript