WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:テキストフィールドに表示

0:[投稿] 勉強ちゅ [2005/10/20 13:38 ] [環境:XP XP]

まだまだ初心者です。

チェックBOX or セレクトメニューで選択された項目を一つのテキストフィールドに項目ごとに改行して表示させる方法はありますでしょうか?


1:[回答] gun [2005/10/20 17:33 ]

選択されたら追加して、非選択に戻されたら削除する
ということになりますか?


2:[回答] 勉強ちゅ [2005/10/20 18:14 ]

はい、そのとおりです。
下に表示を記載してみました。
よろしければご教授を宜しくお願いします。

選択メニュー
■1、あいうえお(チェック有)
■2、かきくけこ(チェック無)
■3、さしすせそ(チェック有)

テキストフィールド内の表示例
あいうえお
さしすせそ


3:[回答] 勉強ちゅ [2005/10/20 18:51 ]

追記すいません^^;

選択メニューはセレクトメニューで項目選択が出来る状態です


4:[回答] あ [2005/10/20 21:38 ]

単に「内容に変更が有ったらテキストボックスを全て書き直す」とすれば良いのでは?
ちなみに
「テキストフィールドに項目ごとに改行して」は
「テキストボックスに項目ごとに改行して」ですよね?


5:[回答] 勉強ちゅ [2005/10/23 09:40 ]

返答が遅れて申し訳ございません。

「テキストフィールドに項目ごとに改行して」は
「テキストボックスに項目ごとに改行して」ですね^^;

全ての項目毎に改行して、一つのテキストBOXに表示をさせる事が出来ればと思ってます。
わかりずらくてすいません。


6:[回答] gun [2005/10/23 11:20 ]

チェックボックスの選択値は、
<label for="xxx">この部分</label>
のことですか?


7:[回答] 勉強ちゅ [2005/10/23 11:48 ]

はい。そうです。
もしくわ、セレクトメニューからの選択でもできればと思って、
試行錯誤してます;;


8:[回答] gun [2005/10/23 12:02 ]

>> 4 の あさん の方法で実現することになります。

勉強中らしいので、まずはヒントです。

イ.関数をつくる
 1.全inputのオブジェクトを配列に取得する
 2.全ラベルのオブジェクトを配列に取得する
 3.上記1をループする
  4.今回のinputのtypeが"checkbox"かどうか判定する
  5.チェックボックスがチェックされているか判定する
  6.上記2をループする
   7.今回のラベルのhtmlFor が 今回のinputのidと一致するか判定する
   8.今回のラベルのchildNodes[0].dataをテキストエリアに代入する
 9.全セレクトのオブジェクト配列に取得する
 10.上記9をループする
 11.今回のセレクトのvalueをテキストエリアに代入する

 ※全inputタグのオブジェクトを取得するには下のようにします
 var arrInputs = document.getElementsByTagName("input");
 ※テキストエリアのオブジェクトを指定するには下のようにします
 document.getElementById("idtextarea");

ロ.HTMLをつくる
 1.チェックボックスのonClickに上記イの関数を登録
 2.セレクトのonChangeに上記イの関数を登録
 3.必要あればセレクトで選択させるoptionの一番上には、---など未選択をつくる
 4.テキストエリアにidを付ける(上記ではidを"idtextarea"としています)


9:[完了] 勉強ちゅ [2005/10/23 12:05 ]

ありがとうごいざいます!

このヒントを元に、がんばって作ってみます!


10:[回答] gun [2005/10/23 12:09 ]

改行は \n です。
テキストエリアへの代入は下のようにすればいいです。
document.getElementById("idTextarea").value += 値 + "\n";

回答(必須): 状態:

お名前(必須):

URL:




[戻る]