セレクトボックスのデータをリストボックスへ書き出す

質問

javascript初心者です。よろしくお願いします。

まず年月日を３つのセレクトボックスで作成する。
追加ボタンを押すと、選択した年月日のデータをリストボックスに書き出すことができる。
※ここでリストボックスのサイズは３に指定しておき、項目が３以上の場合はスクロールさせる。

さらに削除ボタンを作成し、リストからデータを削除できるようにする。

以上のような仕組みを作りたいのですが．．．
どうかよろしくお願いいたします。

回答No.4

noname#23734 · ベストアンサー

createのeの入力ミス
deloptionのselect'の入力忘れ
TagNameの入力ミス
リスト側未選択時の条件追加

を修正し、IE6でのみで確認しました。
win98,ie6です。

function insoption(obj){
var SELECT = obj.parentNode.getElementsByTagName('select')
var optiontext = document.createTextNode(SELECT[0].value + "年" + SELECT[1].value + "月" + SELECT[2].value + "日")
var OPTION = document.createElement('option')
OPTION.setAttribute('value',optiontext)
document.getElementsByTagName('fieldset')[1].getElementsByTagName('select')[0].appendChild(OPTION)
OPTION.appendChild(optiontext)
}

function deloption(obj){
var SELECT = obj.parentNode.getElementsByTagName('select')
var No = SELECT[0].selectedIndex
if(SELECT[0].children.length != 0&&No != -1){
SELECT[0].removeChild(SELECT[0].getElementsByTagName('option')[No])
}
}

お礼

回答ありがとうございました。
こちらでも動作確認できました。fieldsetを使わずにこれを可能にすることはできますでしょうか？

回答No.3

noname#23734

<form>
<fieldset>
<select>年</select>
<select>月</select>
<select>日</select>
<input type="button" value="ins" onclick="insoption(this)">
</fieldset>
<fieldset>
<select size="3"></select>
<input type="button" value="del" onclick="deloption(this)">
</fieldset>
</form>
<script>
function insoption(obj){
var SELECT = obj.parentNode.getElementsByTagName('select')
var optiontext = document.creatTextNode(SELECT[0].value + "年" + SELECT[1].value + "月" + SELECT[2].value + "日")
var OPTION = document.creatElement('option')
OPTION.setAttribute('value',optiontext)
document.getElementsByTagName('fieldset')[1].getElementsByTagNmae('select')[0].appndChild(OPTION)
OPTION.appendChild(optiontext)
}

function deloption(obj){
var SELECT = obj.parentNode.getElementsByTagName(select)
var No = SELECT[0].selectedIndex
if(SELECT[0].children.length != 0){
SELECT[0].removeChild(SELECT[0].getElementsByTagName('option')[No])
}
}
</script>
こんな感じになるのかな。

補足

回答ありがとうございます。
selectに項目をいれ実行してみたのですが、リストボックスに出力されません。構造的に問題があるのでしょうか？

回答No.2

VCAT

ああ、そういうことですか。リストボックスねえ。
ちょっとわからないことが多いんですが、
＞まず年月日を３つのセレクトボックスで作成する。
って、年、月、日のセレクトボックス各１個があるってことですか？
それとも、年月日が３つあるんでしょうか？

その年月日はなんですか。現在の日付？

セレクトボックスに書き出すのは３ついっしょ？
年
------
月
-----
日
なんでしょうか？
もっと具体的にほしいですね。

補足

＝＝＝＝＝＝＝＝＝＝＝＝
2006年12月19日　　　　　　←３つのセレクトボックスで表現　　　
[追加する]　　　　　　　　←リストボックスへ書き出し　　　
[リストボックス]　　　　　←2006年12月19日と表示　
[選択項目を削除する]　　　←上のリストボックスから削除する
＝＝＝＝＝＝＝＝＝＝＝＝
上の画面のような感じです。
さらにセレクトボックスについて具体的に以下のとおりです。
<SELECT name="y2" >
<option value="2006">06</option>
<option value="2007"selected>07</option>
<option value="2008">08</option>
</SELECT>/
<SELECT name="m2" >
<option value="1"selected>1</option>
　　　　　　　:
<option value="12">12</option>
</SELECT>/
<SELECT>
<option value="1"selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
　　　　　　　:
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</SELECT>
よろしくお願いします。

回答No.1

VCAT

セレクトボックスはわかるんですが、リストボックスって何ですか？
知りませんでした。すいません。

補足

リストボックスとは
<select size="4" style="width : 315px;" input type="text" >
<option></option>
<option></option>
<option></option>
</select>
こんな感じのものです。
初心者ですがよろしくお願いします。