Javascript-форум - HTML + JavaScript, select, input.

Я практически не знаю JavaScript, только HTML более менее и есть у меня был заготовок с лабораторных из которого мне надо сделать форму которая содержит поле ввода, два списка и кнопки ««» и «»». После нажатия кнопки ««» («»») содержимое поля ввода или выбранную в правом (левом) списке строку переслать в левый (правый) список. После закрытия панели отобразить содержимое списков.

Я пытался решить это только своими знаниями HTML и тем что вычитал про JavaScript. Но к сожалению ничего не получилось, если кто подтолкнёт в нужном направлении. Как я примерно понял нужно создать ещё одину функцию с массивом и в input'ах я не пойму как прописать что бы они отсылали в определенный список.

Ещё я на самом деле не пойму как это "после закрытия панели" и как они потом должны отобразится =(

Можно ли использовать input без value?

<HTML>
<Head>
<Title> innerText</title>
<Script type="text/JavaScript">
	function AddColor(f)
	{
	   var elOpt=new Option;
           str=f.ColorName.value;
	   if (str.length==0) return;
           elOpt.text=str;
           elOpt.value=f.ColorValue.value;
           f.Colors.options.add(elOpt);	
	}


function AddColor2(f)
	{
	   var elOpt=new Option;
           str=f.ColorName2.value;
	   if (str.length==0) return;
           elOpt.text=str;
           elOpt.value=f.ColorValue2.value;
           f.Colors2.options.add(elOpt);	
	}


        function DelColor(opt)
        {
           i=0;
           while(i<opt.length)
             if(opt[i].selected) opt[i]=null;
               else i++;
        }
        function RetColor(opt)
        {
           for (sel=0, i=0; i<opt.length; i++)
            if (opt[i].selected) sel++;
            var RetVal = new Array(sel+sel);
            for (k=0, i=0; i<opt.length; i++)
              if (opt[i].selected)
                  { 
                    RetVal[k++]=opt[i].text;
                    RetVal[k++]=opt[i].value;
                    window.returnValue = RetVal;
                   }
              window.close();
         }
         function Cancel()
         {
             window.returnValue = new Array;
             window.close();
         }  
</script>

</head>




<body>
<script type ="text/JavaScript">
<!--
     document.write("<h2>"+window.dialogArguments+"</h2>");
//-->
</script>	



<form style="text-align:center">
<table border="0" cellpadding="2">
<tr>
  <td><select tabindex="4" size=4 name="Colors" multiple>
     <option value="red">красный</option>
     <option value="blue">синий</option>
     <option value="green">зеленый</option>
     <option value="white">белый</option>
 <td><select tabindex="4" size=4 name="Colors2" multiple>
     <option value="red">красный</option>
     <option value="blue">синий</option>
     <option value="green">зеленый</option>
     <option value="white">белый</option>
</select>
<br>
</table>
<table border="0" cellpadding="2">
<td>

Имя<br>
<input tabindex="1" type=text id="ColorName">
<td>Значение<br>
<input tabindex="2" type=text id="ColorValue">
<tr>
  <td>
  <input type="button" tabindex="100" onclick="DelColor

(this.form.Colors.options)"
       id="Rem" value="Удалить выбранный цвет">
  <td colspan="2">
  <input type="button" tabindex="3" onclick="AddColor(this.form)"
       id="Add" value="Добавить в список">
<tr><td colspan ="2"><br>
  <input type="button" tabindex="5" onclick="RetColor

(this.form.Colors.options)"
       id="Ret" value="Вернуть выбранный цвет">
  <td><br>
  <input type="button" tabindex="6" onclick="Cancel()"
       id="Can" value="Отмена">
</table><br>
</form>
</body>
</html>