Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Разбор массива объектов json (https://javascript.ru/forum/events/71132-razbor-massiva-obektov-json.html)

mcmega 28.10.2017 18:51

Разбор массива объектов json
 
Всем привет!
Подскажите, есть массив объектов вида:
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)?
Помогите пожалуйста!

рони 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 28.10.2017 19:27

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

рони 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 28.10.2017 20:19

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


Часовой пояс GMT +3, время: 03:34.