• ベストアンサー

hiddenを動的に作成したい

何度も呼ばれるfunction(testfunc)があり、ここではparamaterというフィールドがあればそこに値を設定し、なければparamaterというhiddenフィールドを作成し、そのフィールドに値を作成。 その後、Ajax.Requestを使用して値をサーバに渡したいです。 下記のように作成しましたが、createhidden実行後もformobj.paramaterはundefinedになってしまいます。 ただ、実際は作成されているようで、サーバーには最初に設定した値が何度も飛んできている状態です。(同じnameのhiddenがたくさんできている状態?) 特にこの方法にこだわる事はないので、もっといい方法があればそれでも構いません。(post時に別のやり方?で値を渡すなど) 尚、最初からhtmlにhiddenを書いておくというのは無しでお願い致します。 function testfunc (value) { formobj = document.forms[0]; if (formobj.paramater) { formobj.paramater.value = value; } else { createhidden('paramater', value, formobj); } new Ajax.Request('./Suggest.do', { // 正しく補完情報を取得できた場合 onSuccess: aaaa, onFailure: bbbb, postBody: Form.serialize(formobj), asynchronous: true, method: 'post' }); } function createhidden( name, value, form ){ var elm = document.createElement('input'); elm.type = 'hidden'; elm.name = name; elm.value = value; form.appendChild(elm); }

質問者が選んだベストアンサー

  • ベストアンサー
  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.2

createhidden()を function createhidden( name, value, form ){ form.innerHTML += '<input type="hidden" name="' + name + '" value="' + value +'">'; } のように書けばIEでも標準ブラウザでもOK

tetuya120
質問者

お礼

回答ありがとうございました。 yyr446様のソースをそのまま使用させていただきました。

その他の回答 (2)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.3

すでに回答は出ていますが… name属性で取得できないIEでも、一応、nameは定義できているみたい。ただし、要素の取得にそのname属性が利用できないようだ。 要素を取得して、「element.name」を見るとparamaterが返ってくるし、送信時もちゃんとparamaterとして送られるようだ。 単純に formobj.paramater だとundifinedになっちゃうけれど、以下のような方法にすれば確認も可能です。 (IE6のみ。7、8については未確認) var flg = false, c = document.forms[0].firstChild; while (c) { if (c.name == 'paramater') { flg = true; break; } c = c.nextSibling; } *ところで「parameter」だとばかり思い込んでいたので、全然取得できなくて??状態だったんだけど、よく見たら「paramater」ってなってた…

tetuya120
質問者

お礼

回答遅れて申し訳ございません 名前での確認方法ありがとうございます 勉強になります paramaterはparameterのスペルミスですね。。。 恥ずかしい。。。

  • imq
  • ベストアンサー率72% (16/22)
回答No.1

IEではform関連要素のname属性は動的に変えられない仕様になっています。 要素作成時に限れば、こういうこんな感じにname属性を付けられます。 var elm = document.createElement('<input name="' + name + '">'); ただし、他のブラウザではこの記述が無効なので分岐します。 var elm = document.createElement(/*@cc_on'<' + @*/'input'/*@cc_on + ' name="' + name + '">'@*/); 他の部分は動いていると思います。

tetuya120
質問者

お礼

回答ありがとうございます。 これもIEの仕様だったんですね。。。 ほんとIEには悩まされます><

関連するQ&A

  • javascriptでhiddenに二次元配列を格納したい

    現在、Webのシステムでクライアント側のJavaScriptから サーバー側のPHPに値を渡そうと思ってます。 その際に、JavaScriptの配列と連想配列を組み合わせた二次元配列に 値を格納してサーバー側に渡そうと思ってます。 それで以下のような方法を試しているのですが、 hiddenに二次元配列を格納する方法が分からず困ってます。 分かる方がいらしたら教えて頂けますでしょうか。 よろしくお願いいたします。 =========================================== var actionName = document.forms[0].action; var bodyObj = document.body; var formObj = document.createElement("FORM"); var hiddenObj = document.createElement("HIDDEN"); formObj.name = "updateTest"; formObj.action = actionName; formObj.method = "post"; hiddenObj.name = "alltest[][]"; var norArr = new Array(); var hashArr = new Array(); var i = 1; hashArr['test'] = document.getElementById("test" + i).value; norArr[i-1] = hashArr; hiddenObj.value = hashArr; formObj.appendChild(hiddenObj); bobyObj.appendChild(formObj); formObj.submit();

  • hiddenの値の受け取り方。

    ログイン画面で入力された「ID」の値を、以降のページで保持しておきたいのですが。 ログイン画面で入力されたID(name=ID)を、次画面で <% Dim SID   SID=Request.Form("ID") %> ID:<%= SID %> と表示し、 <FORM action="次画面" method="post"> <INPUT type="hidden" name="HID" value="<%= SID %>"> </FORM> という感じで、次画面に送ります。 (この状態でソースを見ると、SIDには入力値が入っています) で、次画面で ID:<%= request.Form("HID") %> としていますが、表示できません。 ソースをみても値が何も入ってない状態です。 いきづまってしまっています。 どなたかアドバイスお願いします。

  • formのfileの値をhiddenでも持ちたい

    お疲れ様です。いつもお世話になっております。 on~~イベントで値をコピーするやり方でいけるのかもと思いつつ、 うまくイメージがまとまらないので質問させてください。 <input type="file">で、ファイルが選択されたら、その値(ファイルのパス)を同じフォーム内のhiddenにも持ちたいのです。 もっと具体的にいうと hiddenに持った時、ファイル名の拡張子にかかわらず、拡張子を落として、[ファイル名]_thumnail.jpgとつけて、submitしたいのです。 <form action="xxx.php" method="post" enctype="multipart/form-data" name="myForm"> <input type="file" name="upfile" /> <input type="hidden" name="thumnail" /> </form> document.myForm.upfile.value=document.myForm.thumnail.value; みたいな感じでできるのでしょうか。 よろしくお願いします。

  • hiddenのvalueの値を変えたい

    おはようございます。 教えていただきたいことがあります。 HTMLのほうに <input type="hidden" name="btn" value=""> と書きます。 それでJavaSctiptのfunctionの中で document.forms[0].btn.value=funcitonの引数; とやっているのですが、hiddenのvalueの中に値が入っていないようです。 どうしてでしょうか? こういう使い方ってできないものなのでしょうか? 宜しくお願いします。

  • PHP内で作成したHiddenタグが、ソース表示で見えてしまう

    PHP内で作成したHiddenタグが、ソース表示で見えてしまう 熟練者・経験者の皆様にはお世話になっております。 よろしくお願いします。 現在、ログイン画面(html)⇒メニュー画面(php)⇒各画面(php) で構成されるサイトを作成しています。 ログイン画面ではIDとPASSWORD文字列を引数にJavaScriptの関数を実行し、POSTしています。 IDとPASSWORDはメニュー画面のPHP内で受け取り、 問い合わせをして正しければメニュー画面のhtmlを表示し、 正しくなければログインエラーのhtmlが表示されます。(ついでに社員番号やその他の値も取ってます) ですがメニュー画面から各画面へ遷移する際に、ログインIDや、 その他の情報をどうやって渡してやればよいのか判りません。 ログイン画面(html)からメニュー画面(php)へのPOSTと同じ用に メニュー画面もタグのValue(IDやPASSWORD)を引数に JavaScriptでSubmitすれば良いと考えました。 しかしその為にはまずPHTがログイン画面から受け取った値を、 HiddenタグでHtmlに渡してやる必要があります。 ですが、ブラウザで「ソースを表示」としてソースを見ますと、Hiddenタグが見えてしまうのです。 書いているソースは少々はしょりますがこんな感じのものです。 1.login.html <form action="menue.php" name="form_login" method="post"> 社員ID:<INPUT type="text" size="24" name="id_txtbox"> PassWord:<INPUT type="text" size="20" name="password_txtbox"> <IMG id="btnlogin" onclick="login(id_txtbox.value,password_txtbox.value); "name="btnlogin"> </form> 1.2. login.js function login(id,pass){ document.form_login.id_txtbox.value = id; document.form_login.password_txtbox.value = pass; document.form_login.submit(); } 2.menue.php <?php $user_id = $_POST['id_txtbox']; $user_pass = $_POST['password_txtbox'];  $hiddentag1 .= "<input type='hidden' id='hid_id' name='hid_id' value=" .$user_id. ">"; ?> <html> <body> <form action="edit.php" name="link_edit" method="post"> <?= $hiddentag1 ?> </form> </body> </html> menue.phpが表示された際に、右クリックメニューからソースの表示を選択し、 ソースを見ますと、hiddenタグが表示されてしまっています。 もしPASSWORDがmokoだったら、 <input type='hidden' id='hid_id' name='hid_PASS' value=moko> と見えてしまいます。 これではIDやパスワードをページ間で持ちまわる事は危なくて出来ません。 しかし、login.htmlからのアクセス以外(URL直打ち等)をはじく為には 全てのページで最初にIDとPASSWORDによる認証が必須とも考えています。 どうすれば「ソース表示」で見せずに、phpからhtmlに重要な値を渡し、 それを他のphpにPOSTする事が出来るでしょうか? PHP,POST等のキーワードで探しても、検索語句が悪いのか、なかなか解決方法を見つかれずにいます。 どうかご教授くださいませ。

    • ベストアンサー
    • PHP
  • HTMLのinputタグ数が変わる場合のjavascript処理

    HTML上にinputタグが複数あって、その値をJavascriptで配列として受け取るコーディングをしています。 例えばこんな感じで・・・ 【サンプル1】 <form method="post" action="***.cgi" name="form1" onsubmit="return valueCheck(this);"> <input type="hidden" name="wData" value="aaa"> <input type="hidden" name="wData" value="bbb"> </form> function valueCheck(wForm) { document.write('wData='+wForm.wData[0].value); document.write('wData='+wForm.wData[1].value); } ただ、inputが1つしかない時もあるのですが、そのときの値が配列で受け取れません。 下記のように修正すると動くので、配列じゃないただの値だと判断されているようです。 【サンプル2】 <form method="post" action="***.cgi" name="form1" onsubmit="return valueCheck(this);"> <input type="hidden" name="wData" value="aaa"> </form> function valueCheck(wForm) { document.write('wData='+wForm.wData.value); } inputの値がいくつあるのかは都度変わるので、1つの時でも配列で処理したいのですが どのように記述すればいいのでしょうか。

  • JavaScriptにて動的に配列を作成して、POSTで渡したい

    独学でJavaScriptの勉強をしているものです。 勉強用に作っているサイトにて、どうしてもやり方がわからないことがあるので、教えて下さい。 以下のようなフォームがあったとします。 <form name="testForm1"> <input type="hidden" name="id" value="1" /> <input type="checkbox" name="check" /> </form> このフォームは動的に複数作成され、idのvalueはフォームごとに別の値が入ります。 それで行いたいことは、複数あるtestForm1から、チェックボックスにチェックが付いているidだけを取得して、別のページにPOSTで渡したいんです。 以下のようなスクリプトを書いたのですが、思うように動作してくれませんでした。 <form action="hoge" name="testForm2" method="post"> <input type="hidden" name="id" /> </form> function func() { var idArray = new Array(); for ( count = 0; count < document.testForm1.length; count++ ) { if ( document.testForm1.check.checked == true ) { idArray.push( document.testForm.id.value ); } } document.testForm2.id.value=idArray; document.testForm2.submit(); } JavaScriptに関しては独学で必要に応じて勉強している感じで、あまり基礎がわかっておらず、もしかしたらかなり的外れな質問になってしまっているかもしれませんが、どうか宜しくお願い致します。

  • hiddenに値を設定する方法

    いつもお世話になります。 selectboxの選ばれている項目の番号、いわゆるselectedIndexをhiddenに設定してsubmitで取得したいのですが、エラーがでてしまいます。 いまいちhiddenの使い方もわかっていないので見当違いな書き方をしているかもしれませんが、 現在の状態を以下に示しますのでご指導よろしくお願いします。 [javascriptの中] function err(){ document.myForm.NaNo.value = myForm.cbName.selectedIndex; } [htmlの中] <body onLoad=err()> <form name="myForm" method="post"> <select name="cbName"> <option value=""><br></option> <option value="花子">花子 <option value="和子">和子 <option value="良子">良子 </select> <input type="hidden" name="NaNo">

  • formのボタンをsubmitしたときにアラート

    javascript で、formのボタンをsubmitしたときに アラートが出るようにしたいと思います。 下記のように作ってみましたが、うまく動きません。 どのようにすれば動くでしょうか? ご教示いただきたくお願いいたします。 <script type="text/javascript"> function(){ $('form1').submit(function(){ $.ajax({ type: 'POST', data: postData, url: 'buy.php', success: function(data){alert("購入できました");} error: function(){alert('購入できませんでした。再度お試しください');} }); return false; }); } </script> <form name="form1" id="form1" method="POST" name="form1" value="form1" action="buy.php"> <input type="hidden" name="id" value="100" /> <input type="hidden" name="name" value="高橋" /> <input type="submit" value="Save"> <form/>

  • hidden属性だけのフォーム

    hidden属性だけのフォームというのはちゃんと動作しますか? 自分のソースでは動作せず、送り先のPHPスクリプトでvar_dump()すると、$_POST['']の中身が NULL になってました。送信やリセットボタンを作らずに送信できるとすれば、どんな ソースになりますか? <?php echo '<form name="form1" method="POST" action="../../disp_access.php">'; echo '<input type="hidden" name="from" value="1">'; // どのページから飛んできたかを示す echo '<input type="hidden" name="browser" value="'.$referer.'">'; echo '<input type="hidden" name="ip" value="'.$ip.'">'; echo '</form>'; ?>

    • ベストアンサー
    • HTML