|
|
|
|
 |
|
在祐 / 2016-10-14 / 오후 1:30:08 / 61.78.108.65
조회수 : 588
|
| [추천] multiple selectbox |
<ul>
<li onclick="this.parentNode.removeChild(this);">
<input type="hidden" name="ingredients[]" value="Cheese" />
Cheese
</li>
<li onclick="this.parentNode.removeChild(this);">
<input type="hidden" name="ingredients[]" value="Ham" />
Ham
</li>
<li onclick="this.parentNode.removeChild(this);">
<input type="hidden" name="ingredients[]" value="Mushrooms" />
Mushrooms
</li>
</ul>
<select onchange="selectIngredient(this);">
<option value="Cheese">Cheese</option>
<option value="Olives">Olives</option>
<option value="Pepperoni">Pepperoni</option>
...
</select>
function selectIngredient(select)
{
var option = select.options[select.selectedIndex];
var ul = select.parentNode.getElementsByTagName('ul')[0];
var choices = ul.getElementsByTagName('input');
for (var i = 0; i < choices.length; i++)
if (choices[i].value == option.value)
return;
var li = document.createElement('li');
var input = document.createElement('input');
var text = document.createTextNode(option.firstChild.data);
input.type = 'hidden';
input.name = 'ingredients[]';
input.value = option.value;
li.appendChild(input);
li.appendChild(text);
li.setAttribute('onclick', 'this.parentNode.removeChild(this);');
ul.appendChild(li);
} |
| |
▶ 관련 싸이트
http://odyniec.net/articles/multiple-select-fields/
|
|
|
|