[HTML] pole formularza Opcje

[eska97]

Jak zrobić takie pole w formularzu?
(IMG:http://screenshootereu.blob.core.windows.net/engine4files/emdbrsrqzylneqpzxfezwofqnnwyrmwavzpixyiunnfqjosgxonyxgzqhnoevtynbkrebgcyxkmiiogyvqacyxcozybkkdyuorpz#.jpg)

[Tomplus]

Notepad++ ?

Kod

<select multiple>
  <option value="php">.php</option>
  <option value="html">.html</option>
  <option value="js">.js</option>
  <option value="json">.json</option>
</select>

A aby działało tak samo, to przydałoby się zastosować funkcje Javy Script które będą zaznaczony Option przenosić do drugiego Selecta.

[eska97]

Napisałem sobie coś takiego.

[HTML] pobierz, plaintext 
<form id="form" action="?step=2" method="POST">
<table border="0"><tr><td><select id="sel1" style="width: 200px; height:400px;" multiple>
  <option value="php">.php</option>
  <option value="html">.html</option>
  <option value="js">.js</option>
  <option value="json">.json</option>
</select></td><td>
<button type="button" onclick="addOption()">-></button><br>
<button type="button" onclick="remOption()"><-</button>
</td><td>
<select id="sel2" style="width: 200px; height:400px;" multiple name="sel2[]">
</select>
</td></tr><table><input onclick="send()" type="button" value="Zatwierdź"></form>
<script>function addOption() {
do{
    var sel1 = document.getElementById("sel1");
    var sel2 = document.getElementById("sel2");
    var option = document.createElement("option");
	var selected = sel1.selectedIndex;
    var options = sel1.options;
    option.text = options[selected].text;
    sel1.remove(options[selected].index);
    sel2.add(option);}
while(sel1.selectedIndex!=="");
}function remOption() {
do{
    var sel1 = document.getElementById("sel1");
    var sel2 = document.getElementById("sel2");
    var option = document.createElement("option");
	var selected = sel2.selectedIndex;
    var options = sel2.options;
    option.text = options[selected].text;
    sel1.add(option);
    sel2.remove(options[selected].index);}
while(sel2.selectedIndex!=="");
}
function send()
{
  var selObj = document.getElementById("sel2");
  for (var i=0; i<selObj.options.length; i++) {
    selObj.options[i].selected = true;
  }
  document.getElementById("form").submit();
}
</script>
[HTML] pobierz, plaintext 

Tak, Notepad++. Tutaj znalazłem takiego selecta do przykładu najszybciej. (IMG:style_emoticons/default/smile.gif)

Ten post edytował eska97 8.11.2015, 11:48:00