Массив из значений select

208
07 октября 2017, 21:38

Подскажите пожалуйста. У меня есть select который формируется циклом PHP. мне нужно все значения option в нём собрать в массив через js и вывести его в другом select. Как это можно сделать. Прилагаю свой код

function rel_select(){
     global $wpdb;
     $table_cat = $wpdb->prefix . 'rel_cat';
    $rel_cat = $wpdb->get_col("SELECT name FROM $table_cat");
?>
 <select name="cat-select" id="category-select">
<option value="">Select category</option>
<?php
foreach($rel_cat as $key => $value):
    $key = 1;
echo '<option value="'.$value.'">'.$value.'</option>'; 
endforeach;
?>
</select>
<?php
} ?> 

а в этом месте мне нужно вывести options в новом select

 document.getElementById("cat_val"+id).innerHTML="<select id='cat_sel"+id+"' name='cat-select'> <option value='"+cat+"'></select>";
Answer 1

Короче, если я верно понял что нужно сделать, предлагаю просто скопировать селект, дать ему другой id и вставить в нужное место :

var oldSelect = document.getElementById("select1"); 
var ddlId = 1; 
 
function CreateNewDdl() { 
  var newSelect = oldSelect.cloneNode(true); 
  ddlId++; 
  newSelect.id = 'select' + ddlId; 
 
  document.getElementById("cat_val1").appendChild(newSelect); 
};
<select id="select1"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<button onclick="CreateNewDdl();">create ne ddl</button> 
<br/> 
 
<div id="cat_val1"></div>

Вот еще вариант (с использованием innerHTML):

var oldSelect = document.getElementById("select1"); 
var ddlId = 1; 
 
function CreateNewDdl() { 
  document.getElementById("cat_val1").innerHTML += "<select id='cat_sel" + ddlId + "' name='cat-select'>" + oldSelect.innerHTML + "</select>"; 
  ddlId++; 
};
<select id="select1"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<button onclick="CreateNewDdl();">create ne ddl</button> 
<br/> 
 
<div id="cat_val1"></div>

Так-же можно достать все option у селекта в виде массива обьектов и в цикле пробежаться по ним, сделав в процессе все что угодно :

var oldSelect = document.getElementById("select1"); 
 
function CreateNewDdl() { 
  for (var i = 0; i < oldSelect.options.length; i++) { 
    console.log(oldSelect.options[i].value); 
  } 
};
<select id="select1"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<button onclick="CreateNewDdl();">click</button> 
<br/> 
 
<div id="cat_val1"></div>

READ ALSO
Проблема с библиотекой libcurl. Не компилируется программа на Linux

Проблема с библиотекой libcurl. Не компилируется программа на Linux

Здравствуйте, проблема с компиляцией программы на OS Linux Ubuntu, ОС стоит на плате odroid-xu4, с ARM процессоромБиблиотеку подключил, ругается только...

290
QTcpSocket чтение данных в другом потоке

QTcpSocket чтение данных в другом потоке

Есть класс для работы с оборудованием, который имеет 2 основных метода

265
Команда RC_ICONS не работает

Команда RC_ICONS не работает

Хочу поставить иконку для приложения, следуя инструкции с http://docqt

276