痔になりやすい生活習慣とは?

<input>の選択肢をプルダウンメニューから受け取り、hiddenで渡したいのですが、どうすればよいでしょうか?

▽プルダウン例
<FORM>
<SELECT>
<OPTION SELECTED>SELECT</OPTION>
<OPTION VALUE="1">A</OPTION>
<OPTION VALUE="2">B</OPTION>
<OPTION VALUE="3">C</OPTION>
</SELECT>
</FORM>

↑上で選択した値(A or B or C)値を、↓下のvalue=「"hoge"」に渡したいです。
※選択肢は3つだけではなくて、たくさんあります。

▽input例
<input name="hosted_button_id" value="hoge" type="hidden">

http://oshiete.goo.ne.jp/qa/6016233.htmlの質問内容が知りたいことに近かったのですが、value値ではなくて、選択した内容そのものをhiddenへ渡す方法を教えてください。

「<input>の選択肢をプルダウンメニュ」の質問画像

このQ&Aに関連する最新のQ&A

A 回答 (4件)

まずhiddenの値についてですが、



<input id="hosted_button_id" name="hosted_button_id" value="hoge" type="hidden">

↑のように初期表示の時のvalueの部分をhogeではなく、

<input id="hosted_button_id" name="hosted_button_id" value="<?php 「プルダウンの初期値の名称セット」?>" type="hidden">

↑として予めセットするだけでよいのではないでしょうか。


> APIにはジャンルIDだけ、送ればよいと思います。
> 名称を送りたいのは、遷移先のページタイトルと、遷移先のプルダウン初期表示用で使いたいためです。
> また、ジャンルIDと名称を同時に送ることについて、hiddenで送る行為自体は問題ないと思うのですが、一旦結合してsubmitで送ると、APIにジャンルIDだけが送れなくなるので、結果として、まずいのではないかと思ってます。

遷移先というのは自分で管理されているページですよね?
でしたら名称を別途送る理由が無いと思うのですが…。

最初に回答させていただきましたが、
IDをキーとして名称を値とした配列を作っておけば、
IDさえ送れば名称を決めることができるので、
それで問題ないのではないでしょうか。

APIで名称を使用しなくてもよいのであれば、
IDのみをやりとりした方がずっとシンプルですよ。
    • good
    • 1
この回答へのお礼

ご回答ありがとうございました(何度もすいません…)。

アドバイスいただいた方法で検討してみます。

お礼日時:2010/09/30 17:26

まず、例示のスクリプトがうまく動作しなかったようですみませんでした。


自分の環境では動作したので問題ないと思っていました。


> 今、お伺いしているプルダウンは、添付画像中央部分なのですが、

添付画像が見当たらないのですがどちらでしょう?


> 一旦結合して、後で分けるやり方は、難しいかなと思っていたのですが、書いていただいたコードを見たらイケそうだったので、実際に試してみました。
> やってみて初めて気付いたのですが、自分のケースの場合、このやり方では難しいことが分かりました。
> submitした時点で、APIへパラメータを投げているので、option value=の値を加工すると、その時点で処理がうまく走らなくなってしまいます。「option value=の値」「option value=を加工した値」の両方を投げればいいのか、とも思ったのですが、それだと一つのセレクトボックスでは送れないのではないかと思い、なんとか javascriptで解決したいと思っています。

他の方も疑問に思っているようですが、どんなAPIを使用したいのでしょうか。
APIにはジャンルのIDと名称を同時に送ってやらないといけないのでしょうか。

submitした時点でAPIへパラメータを投げているとは、
htmlフォーム→自サーバ→API という遷移でなく、
htmlフォーム→API→自サーバ というような流れなのですか?

この回答への補足

>添付画像が見当たらないのですがどちらでしょう?
添付しました。

>どんなAPIを使用したいのでしょうか。
楽天APIです。

>APIにはジャンルのIDと名称を同時に送ってやらないといけないのでしょうか。
APIにはジャンルIDだけ、送ればよいと思います。
名称を送りたいのは、遷移先のページタイトルと、遷移先のプルダウン初期表示用で使いたいためです。
また、ジャンルIDと名称を同時に送ることについて、hiddenで送る行為自体は問題ないと思うのですが、一旦結合してsubmitで送ると、APIにジャンルIDだけが送れなくなるので、結果として、まずいのではないかと思ってます。

>submitした時点でAPIへパラメータを投げているとは、
>htmlフォーム→自サーバ→API という遷移でなく、
>htmlフォーム→API→自サーバ というような流れなのですか?
多分、indexフォーム→API→サーバ→searchフォーム→API→サーバ→searchフォームの流れだと思うのですが、すいません、ちょっとこの辺の流れについてはまだ、勉強中で、よく分かってないため、もしかしたら、違うかもしれません。

補足日時:2010/09/30 16:39
    • good
    • 0

<FORM ACTION="">


<P>
<SELECT>
<OPTION SELECTED>SELECT</OPTION>
<OPTION VALUE="A">A</OPTION>
<OPTION VALUE="B">B</OPTION>
<OPTION VALUE="C">C</OPTION>
</SELECT>
</P>
</FORM>

or

<FORM ACTION="">
<P>
<SELECT>
<OPTION SELECTED>SELECT</OPTION>
<OPTION>A</OPTION>
<OPTION>B</OPTION>
<OPTION>C</OPTION>
</SELECT>
</P>
</FORM>

value を連番で振らなければいけないなんて規則はない。

[quote cite="http://www.whatwg.org/specs/web-apps/current-wor … "]
The value attribute provides a value for element. The value of an option element is the value of the value attribute, if there is one, or the textContent of the element, if there isn't.
[/quote]

連番にしたとしても 0 ⇒ A であることが分かっているはずだから、受け取り側で何とでもなるのでは。
    • good
    • 0

■JavaScriptで解決するなら


<form>
<select onchange="document.getElementById('hosted_button_id').value=this.options[this.selectedIndex].text">
<option selected>SELECT</option>
<option value="1">A</option>
<option value="2">B</option>
<option value="3">C</option>
</select>
</form>

<input id="hosted_button_id" name="hosted_button_id" value="hoge" type="hidden">


http://okwave.jp/qa/q6217393.html
上記に解答がありますが、

■phpで解決するなら
<select name="genre">
<option value="1:ジャンル名">…となるようにし、

$tmp = explode(":", $_GET["genre"]);
list($genreId, $genreName) = $tmp;

この回答への補足

回答ありがとうございます。そのままだと識別子エラーとなったので、下記のようにしてみました。
<form action="search.php" method="get">
<select onchange="document.getElementById('hosted_button_id').value=this.options.item(this.selectedIndex).text">


あと一つだけ解決したい点があるので、追加で質問させてください。

今、お伺いしているプルダウンは、添付画像中央部分なのですが、
自分自身にsubmitして、右側のソートだけを選択して検索させた場合(onchangeさせずに、プルダウン初期値の内容で検索する場合)、内容がhiddenに送れません。
※プルダウンの初期値は、受け取った値を表示するように設定しています
※一度選択を外してまた選択し直せば正常動作します(←これをしなくてもデフォルトの値をhiddenへ渡すにはどうすればよいでしょうか。)

http://javascriptist.net/ref/event.onchange.htmlに掲載されているイベントを試してみたのですが、うまく渡りませんでした。

何かよい方法はないでしょうか?


▽PHP
一旦結合して、後で分けるやり方は、難しいかなと思っていたのですが、書いていただいたコードを見たらイケそうだったので、実際に試してみました。
やってみて初めて気付いたのですが、自分のケースの場合、このやり方では難しいことが分かりました。
submitした時点で、APIへパラメータを投げているので、option value=の値を加工すると、その時点で処理がうまく走らなくなってしまいます。「option value=の値」「option value=を加工した値」の両方を投げればいいのか、とも思ったのですが、それだと一つのセレクトボックスでは送れないのではないかと思い、なんとかjavascriptで解決したいと思っています。

補足日時:2010/09/30 12:19
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qselect値をhiddenのvalueに渡したい

selectで選択されたvalue値を下のhiddenのvalue値(id)に渡して、
hiddenのvalue値(id)がselectで選択されたvalue値になるような
フォームを作りたいのですが、作り方をお教え頂ければ幸いです。

<form name="form" method="get" action="index.cgi">
<select name="mode">
<option value="100023">和書</option>
<option value="100241">洋書</option>
<option value="100524">エレクトロニクス</option>
</select>
<input type="hidden" name="serch_janru" value="id" />
<input type="text" name="keyword" value="keyword" /><input type="submit" name="submit" value="商品を検索" />
</form>

ソース等、具体的にお教え頂けると助かります。
どうぞ宜しくお願い致します。

selectで選択されたvalue値を下のhiddenのvalue値(id)に渡して、
hiddenのvalue値(id)がselectで選択されたvalue値になるような
フォームを作りたいのですが、作り方をお教え頂ければ幸いです。

<form name="form" method="get" action="index.cgi">
<select name="mode">
<option value="100023">和書</option>
<option value="100241">洋書</option>
<option value="100524">エレクトロニクス</option>
</select>
<input type="hidden" name="serch_janru" value="id" />
<input type="text" name="...続きを読む

Aベストアンサー

<form>には一切手をつけないとして、
javascriptで
<script type="text/javascript">
<!--
window.onload = function () {
//@cc_on
document./*@if (1)attachEvent('on'+ @else@*/addEventListener(/*@end@*/
'change', function (evt) {
var e = evt./*@if (@_jscript) srcElement @else@*/ target /*@end@*/;
if (e.type=="select-one" && e.name=="mode"){
alert(e.value);
var elements = document.getElementsByName("serch_janru");
elements[0].value=e.value;
}
}, true);
}
// -->
</script>
こうできます。

<form>には一切手をつけないとして、
javascriptで
<script type="text/javascript">
<!--
window.onload = function () {
//@cc_on
document./*@if (1)attachEvent('on'+ @else@*/addEventListener(/*@end@*/
'change', function (evt) {
var e = evt./*@if (@_jscript) srcElement @else@*/ target /*@end@*/;
if (e.type=="select-one" && e.name=="mode"){
alert(e.value);
var elements = document.getElementsByName("serch_janru");
elements[0].value=e.value;
}
}, true);
...続きを読む

Qプルダウンで選択した項目にあわせて、hiddenデータも変化させてcgiにデータを送る

よろしくお願い致します。

プルダウンで項目を選択したとき、選択したプルダウンの項目に合わせて
hiddenデータに入れ替えてcgiに送りたいのですが、そのようなことはできるのでしょうか?

例えば、プルダウンの項目に「魚」と「肉」があったとして、
「魚」を選択すると、hiddnデータ1が「刺身」、hiddenデータ2が「100円」となってcgiに送信されます。

同様に「肉」を選択すると、hiddenデータ1が「豚」、hiddenデータ2が「200円」となってcgiに送信されます。

お分かりにある方がいらっしゃいましたら、どうぞお教え下さいますようお願いいたします。

Aベストアンサー

こんな感じ?

<html>
<script type="text/javascript">
function hoge(e){
var data=['刺身,100円','豚,200円'];
var i=e.elements('sel').selectedIndex;
var d=data[i].split(',');
e.elements('hidden1').value=d[0];
e.elements('hidden2').value=d[1];
}
</script>
<body>
<form action="" method="" onsubmit="hoge(this)">
<select name="sel">
<option value="0">魚</option>
<option value="1">肉</option>
</select>
<input type="hidden" name="hidden1">
<input type="hidden" name="hidden2">
<input type="submit" value="Submit">
</form>
</body>
</html>

こんな感じ?

<html>
<script type="text/javascript">
function hoge(e){
var data=['刺身,100円','豚,200円'];
var i=e.elements('sel').selectedIndex;
var d=data[i].split(',');
e.elements('hidden1').value=d[0];
e.elements('hidden2').value=d[1];
}
</script>
<body>
<form action="" method="" onsubmit="hoge(this)">
<select name="sel">
<option value="0">魚</option>
<option value="1">肉</option>
</select>
<input type="hidden" name="hidden1">
<input type="hidden" na...続きを読む

Qのvalue値をプルダウンメニューから受け取りたいのです

<input>のvalue値をプルダウンメニューから受け取りたいのですが、Javascriptを使用すれば出来るものでしょうか?もし可能でしたら、そのコードを教えて頂きたいです。
当方htmlとcssが少し出来る程度で、ウェブで調べても分からなかったので質問させていただきました。

以下はソースになります。



プルダウンのソース:

<FORM>
<SELECT>
<OPTION SELECTED>SELECT</OPTION>
<OPTION VALUE="AAABBB">A</OPTION>
<OPTION VALUE="BBBBBB">B</OPTION>
<OPTION VALUE="CCCCCC">C</OPTION>
</SELECT>
</FORM>


↑上で選択したvalueの値を、↓下の「ここの値」に渡したいです。


inputのソース:

<input name="hosted_button_id" value="ここの値" type="hidden">



宜しくお願いいたします。

Aベストアンサー

単純にやるならidをふって以下のようにします。
関数化したほうが汎用性はあります
(hiddenだとわたっているかわからないのでtextにしてあります)

<FORM>
<SELECT onchange="document.getElementById('hosted_button_id').value=this.value">
<OPTION SELECTED>SELECT</OPTION>
<OPTION VALUE="AAABBB">A</OPTION>
<OPTION VALUE="BBBBBB">B</OPTION>
<OPTION VALUE="CCCCCC">C</OPTION>
</SELECT>
</FORM>

<input name="hosted_button_id" id="hosted_button_id" value="ここの値" type="text">

Qjavascriptでセレクトボックスの"selected"を動的につ

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
</select>月

<select name='day'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
<option value='13'>13</option>
<option value='14'>14</option>
<option value='15'>15</option>
<option value='16'>16</option>
<option value='17'>17</option>
<option value='18'>18</option>
<option value='19'>19</option>
<option value='20'>20</option>
<option value='21'>21</option>
<option value='22'>22</option>
<option value='23'>23</option>
<option value='24'>24</option>
<option value='25'>25</option>
<option value='26'>26</option>
<option value='27'>27</option>
<option value='28'>28</option>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日


このセレクトボックスに、例えば今日の日付"2010年9月30日"だったら、それぞれの年、月、日の<option>に"selected"をつけたいのですが、javascriptではどのようにして実現したら良いのでしょうか?

よろしくお願いします。

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8...続きを読む

Aベストアンサー

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<option value='2009'>2009</option>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
</select>月

<select name='day'>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日
</div>
</form>

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<opt...続きを読む

Qで配列(複数の要素)を渡したいとき?

こんにちわ,

今HTML+PHPで
$hoge[]にいくつかの要素が入っているとき,
それをあるfoo.phpというページに渡したいとき,
echo '<form action="foo.php" method="POST">';
echo '<input type="hidden" name="$hoge[]" >';
echo '</form>';
としたのですが,うまくいきません。

どうしたらよろしいでしょうか。

Aベストアンサー

nameじゃなく、valueでは?
あとやるなら、
for($i=0;$i<count($hoge);$i++){
print "<input type=\"hidden\" name=\"$hoge[$i][0]\" value=\"$hoge[$i][1]\">";
}
とか?

Qプルダウンを選択していないときは、初期値(selected)の値を、選

プルダウンを選択していないときは、初期値(selected)の値を、選択したときは選択値を、hiddenで渡したい。

▽プルダウン例
<form>
<select>
<option value="0" selected>A</option>
<option value="4">B</option>
<option value="6">C</option>
</select>
</form>

↑上で選択した値(A or B or C)値を、↓下のvalue=「"hoge"」に渡したいです。
※選択肢は3つだけではなくて、たくさんあります。

▽input例
<input name="category_name" value="hoge" type="hidden">
※formとかselectにid振っても構いません。

※javascriptでやりたいです。

Aベストアンサー

違ったoption valueじゃなかった

<form>
<select name="hoge"
onchange="this.form.category_name.value=
this.options.item(this.selectedIndex).text">>
<option value="0" selected>A</option>
<option value="4">B</option>
<option value="6">C</option>
</select>
<input name="category_name"
value="this.form.hoge.options.item(0).text" type="hidden">
</form>

でしょう。

QJava-jspの画面入力値保持について

画面にテキスト、ラジオボタン、リストボックス とボタンがあります。
ボタンを押すと、JAVAで処理を行い、jspのviewで表示します。

1.テキスト、ラジオボタン、リストボックスなどに値が入力、設定されている状態で
ボタンを押して処理後にテキスト、ラジオボタン、リストボックスの値が
変わらないようにしたいのですが、
その場合、たとえば、入力、設定値をセッションになどに格納しておき
jspの所で、セッションから値を設定すると言うような方法になるのでしょうか?

2.ボタン押して処理後、ラジオボタン、リストボックスの選択値も
  変えないようにしたいのですが、
  これはどのように実現するのが、適切なのでしょうか?


以上、よろしくお願いします。

Aベストアンサー

ボタンというのはフォームのサブミットボタンのことですよ?
つまり、画面遷移が起きることを前提とすると(元の同じ画面に戻るのも含みます)

テキスト、ラジオボタン、リストボックスの状態を「要求パラメータ」として
送信し、それを次画面に反映するというのが最も一般的な方法です。

フレームワーク struts のアクションフォーム&JSPカスタムタグを使うと比較的楽に
そういう画面が作れますが、多くのフレームワークでも大差ありません。
簡単な画面なら素のサーブレート+JSPでも十分作れます。

セッションでもできますが、 セッションはログイン情報などの保持など、
限定された範囲で使うのが普通です。また、結局セッションに最新の
テキスト、ラジオボタン、リストボックスの状態を送るには、「要求パラメータ」
を送信する必要があります。

AJAXを使うという方法もあります。この場合、ボタンは AJAX 処理だけを行い
画面遷移を起こさないので、サーバ側で画面のテキスト、ラジオボタン、
リストボックスの状態をもつ必要はありません。

Qリンクをクリックした時にformからPOST送信したい。

HTML、PHP、JavaScript等でサイトを作っているのですが・・・。

【実現出来ている例】
<form name="form1" method="post" action="Next.php" onSubmit="return InputCheck()">
 <input type="submit" value="送信">
</form>
 submitボタンを一つ置いて、それがクリックされた場合に
formの内容をPOSTで送信する。

【実現したい例】
<form name="form1 method="post">
 <a href="Next.php" onClick="???">???</a>
</form>
 formの中のリンクをクリックされた場合に、formの内容を
POSTで送信したいのですが、その実現方法がわかりません。
GETで送るという手もあり得ますが、今回はどうしてもPOST
したいのですが。

Aベストアンサー

<form name="form1" method="post" action="Next.php">
<a href="#" onClick="document.form1.submit();">???</a>
</form>

onclick内の対象がform1としてあてているので、
アンカータグは別にform内に記述しなくても大丈夫です

form内にhidden等でnameとvalueを持ったパラメータがあればそれも送られます

アンカータグから動的にvalueを変更したい場合は、
document.form1.hogename.value = 'hoge';
等をsubmit()の前に行えば可能です

ただしform内に
<input type="hidden" name="hogename" value="">
を記述する等、変更先パラメータの元を用意する必要がありますのでご注意下さい


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング