WiSTERIA ＊ BOARD

とりあえず、作りかけですが・・・。

http://homepage2.nifty.com/godakaz/laboratory/24_nc.html

ただし、追加された行のボタンはダミーです。
（現時点では、ボタンのonClick属性を付与することが出来ていないため
　追加行のボタンを押しても何も動作しません。）

また、行の追加は常に最終行に対して行われています。
（親エレメント（tbody）に、追加エレメント（tr）を付与する際に、既存のエレメントの後ろに付与されるためです。）

エレメントの順番を変更できるかどうかについては、まだ調査していません。

以上、中間報告として。ご参考まで

>いつもサンプルを参考に
>webページを作成しております.そこで一つ問題があります.
>下記サンプルにあります
>　最近使ったもの
>　　■ 入力行の追加（行ごと）の追加
>でnetscapeに対応する方法はないのでしょうか？
>ご存知なら教えてください.
>

Re2:入力行の追加サンプルについて by tkater

2004/01/13 (Tue) 21:08

△up

res/edit

ありがとうございます.
一日悩んでいたんですがなかなかうまくいかず助かりました.
さらにもう1点なんですが、追加した行に対して入力された
value値を取るということはできるのでしょうか？
ごだっちさんが作られたソースの28から29行目
　　var addtxt = document.createElement("input");
　　addtxt.type = "text";
　　addtxt.name = "textname";
　　addtxt.value = "";
のように追加して
もとからある、textにもname属性を追加し、
formにもname属性"form1"を付けて
javascript:alert(document.form1.textname[0].value)
と参照したのですがオブジェクトがないとエラーになってしまいます.
入力値を取得するにはどのようにしたらいいのでしょうか？

>とりあえず、作りかけですが・・・。
>
>http://homepage2.nifty.com/godakaz/laboratory/24_nc.html
>
>ただし、追加された行のボタンはダミーです。
>（現時点では、ボタンのonClick属性を付与することが出来ていないため
>　追加行のボタンを押しても何も動作しません。）
>
>また、行の追加は常に最終行に対して行われています。
>（親エレメント（tbody）に、追加エレメント（tr）を付与する際に、既存のエレメントの後ろに付与されるためです。）
>
>エレメントの順番を変更できるかどうかについては、まだ調査していません。
>
>以上、中間報告として。ご参考まで
>
>>いつもサンプルを参考に
>>webページを作成しております.そこで一つ問題があります.
>>下記サンプルにあります
>>　最近使ったもの
>>　　■ 入力行の追加（行ごと）の追加
>>でnetscapeに対応する方法はないのでしょうか？
>>ご存知なら教えてください.
>>

Re3:入力行の追加サンプルについて by ごだっち＠管理人

2004/01/14 (Wed) 09:40

△up

res/edit

admin

こんな感じかな。

http://homepage2.nifty.com/godakaz/laboratory/24_nc2.html

Re4:入力行の追加サンプルについて by tkater

2004/01/14 (Wed) 11:52

△up

res/edit

>こんな感じかな。
>
>http://homepage2.nifty.com/godakaz/laboratory/24_nc2.html
>
>
すばやいご返事ありがとうございます.非常に助かります.
ごだっちさんのサンプルを下に、テキストボックスのほかに
ラジオボタンやチェックボックスを追加するものを作成いたしました。
var addtxt2 = document.createElement("input");
addtxt2.type = "text";
addtd.appendChild(addtxt2);
addtxt2.setAttribute("name","txtname");
addtxt2.setAttribute("size",20);
addtxt2.setAttribute("maxlength",40);

var addradio = document.createElement("input");
addradio.type = "radio";
addtd.appendChild(addradio);
addradio.setAttribute("name","chkRadio");

var addChkBox = document.createElement("input");
addChkBox.type = "checkbox";
addtd.appendChild(addChkBox);
addChkBox.setAttribute("name","chkBox");
しかし、チェックボックスは動作するのですが追加したラジオボタンが
IEだけ選択することができません.NNではうまくイキマス。
どこか悪いのでしょうか？
また、deleteRowの関数で最終行を削除するメソッドを作成しているのですがうまくいきません。
アドバイス願えますでしょうか

Re5:入力行の追加サンプルについて by ごだ

2004/01/16 (Fri) 12:50

△up

res/edit

admin

Radioの動作が上手くいかない件、こちらでも確認できました。
が、現在のところ未解決です。
MSDNを探してみたのですが、radioの制限事項に関する記述を見つけられませんでした。役に立てずに申し訳ない。
この件、多分、ブラウザ側の内部処理として、追加されたオブジェクト（radio）に対して既存の（同名の） radio と「排他的選択」を動作させるための実装が必要になるかと思うのですが、IEではそれが出来ていないのかも。

それから、deleteRow()の件ですが、以下のようなスクリプトで動作すると思います。

<td>
<input type="button" value="del" onclick="javascript:delrow(this.parentNode);">
</td>

function delrow(obj){
var tdElements = obj;
var trElements = tdElements.parentNode;
var tbodyElements = trElements.parentNode;
var tableElements = tbodyElements.parentNode;
tableElements.deleteRow(1);
}

ここで、deleteRow()の引数として「1」が入っているのは、初期状態（ボタン群が配置されている行）を「０行」とカウントしているため、追加された行は順次「1」「2」「3」という「行番号」が割り振られているので、その最初の追加行を削除するために「1」を引数として与えています。
もちろん、何か別の入力欄を設けておいて、そこで指定された数値の行を削除するなどしても良いかと思います。
以上、ご参考まで

Re6:入力行の追加サンプルについて by tkater

2004/01/21 (Wed) 19:17

△up

res/edit

削除のスクリプトありがとうございました。
あれからいろいろと探してみたのですが
IE5.5とNN7.1以上の<div>属性で動いている
insertAdjacentHTML
を利用して、IE,NN対応の行の追加や削除、値取得をできないでしょうか？
考えたんですがどうもうまく動きません。
よろしければお願いいたします.

Re7:入力行の追加サンプルについて by ごだっち＠管理人

2004/01/24 (Sat) 10:27

△up

res/edit

admin

http://homepage2.nifty.com/godakaz/laboratory/24_nc3.html

こんな感じで「追加」・「削除」・「テキストフォームに入力された内容の取得」は可能かと。

ただ、insertAdjacentHTML が、NN7.1から対応になったいう情報は判りません。Opera7であれば対応になっているかと思いますが、手元のNN7.1環境では、insertAdjacentHTML を動作させることは出来ませんでした。
（尤も、NN7.1上で InsertAdjacentHTML を動かすための情報が確認できていないため、スクリプト記述上のミスによって動いていない可能性もあるかとは思いますが）

以上、ご参考まで

p.ink