「夫を成功」へ導く妻の秘訣 座談会

<script language="JavaScript">
<!--
// 項目の合計を計算
function ttlValue() {
chn = 27; // ラジオボタンとチェックボックスの総数
ttl = 0;
for(i=0; i<chn; i++) {
if(document.nForm.elements[i].checked) {
ttl += eval(document.nForm.elements[i].value);
}
}
document.nForm.result.value = ttl;
}
//-->
</script>

上のスクリプトを使い、選択結果(合計金額)をウエブページ上で確認できるように作りました。
更に、氏名や住所などを入力してもらい、選択結果・合計金額と共にフォームメールとして送信できるようにしました。
一連の流れはできたのですが、どうしても解決できない事があります。

例えば
<INPUT type="radio" name="本数" value="50" checked="checked" /> 3本パック</td>
<INPUT type="radio" name="本数" value="50" checked="checked" /> 4本パック</td>
<INPUT type="radio" name="本数" value="100" checked="checked" /> 5本パック</td>
の場合「value="50"・value="50"・value="100"」となってますからちゃんと計算してくれますが、
フォームメールとして受け取った場合「何本パック」なのか判別できません。
(数字しか記載がないため、上の例で言うと 3本パックと 4本パックの判別ができません)

こんな画像を用意しました。
http://www3.ocn.ne.jp/~aiworks/chie/

「valueに2つの値をセットする」と聞いたことがありますが、どの様にするのか分かりません。

上記内容についてご教授頂ければ幸いです。
宜しくお願い致します。

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

A 回答 (4件)

つづき(全角空白は半角に)



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="ja">
<head><title>sample</title>
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<style type="text/css">
#form1 { width: 25em; }
#form1 input { margin-left: 1em; }
</style>

<script type="text/javascript">
<!--
function check(evt, frm){
 var t = evt.target || evt.srcElement;
 if (!typecheck(t)) return;
 var e, txt, title, i = 0, elms = frm.elements, html = "選択状態";

 while(e = elms[i++]){
  if(typecheck(e) && e.checked){
   html += "<br> " + "title=" + title(e) + " / name=" + e.name;
   html += " / value=" + e.value + " / text=" + text(e);
  }
 }
 document.getElementById("result").innerHTML = html;

function typecheck(e){
 return (e.nodeName == "INPUT" && e.type == "radio");
}

function text(e){
 var c = e.nextSibling, txt;
 return c.nodeType == 3?c.nodeValue:"";
}

function title(e){
 var p = e.parentNode, leg;
 while (p && p.nodeName != "FIELDSET") p = p.parentNode;
 if(p) leg = p.getElementsByTagName("legend")[0];
 return leg?leg.innerHTML:"";
}
}
//-->
</script>
</head>
<body>

<form id="form1" action="#" method="" onclick="check(event, this)">
<fieldset>
<legend>本数</legend>
<input type="radio" name="number" value="50" checked>3本パック
<input type="radio" name="number" value="50">4本パック
<input type="radio" name="number" value="100">5本パック
</fieldset>

<p>
<fieldset>
<legend>サイズ</legend>
<input type="radio" name="size" value="0" checked>Sサイズ
<input type="radio" name="size" value="20">Mサイズ
<input type="radio" name="size" value="20">Lサイズ
</fieldset>

<p>
<fieldset>
<legend>色</legend>
<input type="radio" name="color" value="red" checked>赤
<input type="radio" name="color" value="blue">青
<input type="radio" name="color" value="black">黒
</fieldset>
</form>

<p>
<div id="result"></div>
</body>
</html>
    • good
    • 0
この回答へのお礼

ありがとうございます。すぐにお礼出来なく失礼いたしました。
私の技術レベルが低いので上手く出来るかどうか不安ですが、皆さんに教えて頂いた方法で試してみます。

お礼日時:2011/02/26 14:33

#2、#3です。



#2に書いておくつもりで、書き忘れました。

例に挙げたサンプルは、HTMLのテキストを読み込んでいますが、改行なども一緒に拾っているので、値を使用するときには注意が必要です。
    • good
    • 0

>「value」に2つの値をセットする方法


基本的には値はひとつしか持てません。
でも、ひとつの値に複数の意味を持たせれば、同様の目的は果たすことができます。

例えば、適当な区切り文字を付けておいて
 <input type="radio" name="size" value="M_20">Mサイズ
value値を『_』で分割してあげれば、2つの値として利用することもできます。
(正規表現などで分割できれるものであれば、区切り文字なしでもOKです。上例なら"M20"でもいけそう)

あるいは、value以外の属性値を利用するという方法もありますが、formの送信の際に値が送られないので、value値を利用する方が良いと思われます。

一方で、選択した値が必要であるならその内容を識別できるようにvalue値を設定しておくのが普通だと思われますので、ご提示のような設定方法は少々無理があるかも知れません。パックの種類を入力させるのであれば、その単価は別にテーブルで持っておいて、スクリプト側で換算するのが一般的ではないでしょうか?
それであれば、サーバー側にも単価テーブルがあれば、直接単価を送信する必要もなくなります。


まぁ、ご提示ようなマークアップのままで行いたいのであれば、HTMLからテキストなどを参照するという方法でもいけるかも…
例えば(識別するだけの例なので応用は適当にどうぞ)
文字数制限に引っかかるので、例は別に投稿します。
    • good
    • 0
この回答へのお礼

ありがとうございます。すぐにお礼出来なく失礼いたしました。
私の技術レベルが低いので上手く出来るかどうか不安ですが、皆さんに教えて頂いた方法で試してみます。

お礼日時:2011/02/26 14:33

自分なら、



<INPUT type="hidden" name="選択パック" value="">

というのを用意して、

<LABEL><INPUT type="radio" name="本数" value="50" onclick="document.nForm.選択パック.value='3本'") /> 3本パック</LABEL>

というふうにやるかな。

合計の計算時に問題があれば、type="hidden"をチェックして計算対象外にすればいいと思います。

別な方法としては、送信ボタンを押した直後に関数を呼び出して、ラジオボタンの何番目を選択しているかを調べて、value値を金額から文字列に変えてPOSTされればいいですね。
    • good
    • 0
この回答へのお礼

ありがとうございます。すぐにお礼出来なく失礼いたしました。
私の技術レベルが低いので上手く出来るかどうか不安ですが、皆さんに教えて頂いた方法で試してみます。

お礼日時:2011/02/26 14:32

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

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

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

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

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

Qフォームで同じ複数のnameで違うvalueの送信

始めまして、現在一個のフォーム内で複数の同じnameで、違うvalueを送信しようと苦戦しております、、普通にタグを書くだけでは
一個のnameで違うvalueの送信は、最後のvalueしか送信できないです、
phpは使用できません。javaは、、殆ど素人なので、あまり分かりません、、formを一個一個区切るのも、レイアウト上できません、、
どうすればいいのでしょうか?・・・以下タグです。
昨日から、ここから先に進めません。。
先輩方助けてください、本当によろしくお願いします。

<form action="http://hoge.net/hoge/hogecheck.php" method="post">
<input type="hidden" name="site" value="hoge">
<input name="id" type="text" id="idform" maxlength="10" />

<input type="hidden" name="kin" value="3000">
<input type="image" src="buybtn.gif" />
<input type="hidden" name="kin" value="5000">
<input type="image" src="buybtn.gif" />
<input type="hidden" name="kin" value="10000">
<input type="image" src="buybtn.gif" />
<input type="hidden" name="kin" value="20000">
<input type="image" src="buybtn.gif" />

</form>

始めまして、現在一個のフォーム内で複数の同じnameで、違うvalueを送信しようと苦戦しております、、普通にタグを書くだけでは
一個のnameで違うvalueの送信は、最後のvalueしか送信できないです、
phpは使用できません。javaは、、殆ど素人なので、あまり分かりません、、formを一個一個区切るのも、レイアウト上できません、、
どうすればいいのでしょうか?・・・以下タグです。
昨日から、ここから先に進めません。。
先輩方助けてください、本当によろしくお願いします。

<form action="http://hoge...続きを読む

Aベストアンサー

No.2の回答者です。
スミマセンm(__)m、Javaでしたね。PHPで書いてしまいました。。。

Java だったらこれで取れます。(HTML側の修正は不要です。)
String[] kin= req.getParameterValues("kin");

Qセレクトメニューで2つの項目や値を渡す方法はありますか?

良かったら教えてください。
セレクトメニューで2つの項目や値を渡す方法は
ありますか?
普通は、
<select name="test">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
と言う感じですが、
「テスト」を選ぶと
name="test1" name="test2"の項目で、
value="1111" value="2222"
選択項目は、1つですが、2つの項目、
2つの値を次のCGIに渡す事は、
可能でしょうか?
教えてください。

Aベストアンサー

たぶん ANo1 の elttac さんも、この質問の意味を
解釈するのに悩まれたと思いますが・・・

> 「テスト」を選ぶと
この行から質問文が意味不明になります(汗)
「テスト」ってなんでしょう?

> 選択項目は、1つですが、
> 2つの項目、2つの値を次のCGIに渡す事は
「選択項目が1つ」という点からすると
ANo1 さんの「項目を2つ以上選択する」という解釈
ではないのかなぁと思いまして、別の解釈を

<select name="test">
<option value="test1=1111&test2=2222">「テスト」</option>
</select>

ってしておけば、「テスト」を選択すると
test = "test1=1111&test2=2222"
という値が CGI に送られます。

あとは、送られてきた値を & で分割し
それぞれを = で分割し、前半を変数名・後半を値として
解釈すれば、いいわけです。

CGI の言語が Perl なのか PHP なのか、書いてないので
プログラム例を提示させてあげられなくて残念ですが
意図は伝わったでしょうか?

たぶん ANo1 の elttac さんも、この質問の意味を
解釈するのに悩まれたと思いますが・・・

> 「テスト」を選ぶと
この行から質問文が意味不明になります(汗)
「テスト」ってなんでしょう?

> 選択項目は、1つですが、
> 2つの項目、2つの値を次のCGIに渡す事は
「選択項目が1つ」という点からすると
ANo1 さんの「項目を2つ以上選択する」という解釈
ではないのかなぁと思いまして、別の解釈を

<select name="test">
<option value="test1=1111&test2=2222">「テスト」</option>
</select...続きを読む

Qチェックボックスから複数のvalueを取り出す

HTMLフォームから、action="file.php"でデータの受け渡し→PHPで送られてきたvalueに応じて文章を出力、というプログラムを作っています。

例:
グループAのラジオボタン1にチェック、送信
→グループAで押されたラジオボタンを送信されたvalueで判別、この場合はvalue==A
→value==Aの場合に表示する文章を変数に受け渡し、その変数で表示

ラジオボタン、テキストボックスのvalueは$_POST['XXX']で取り出せたのですが、チェックボックスのデータだけが取り出せません。こちらの質問を検索したとき、多次元配列という言葉を見かけたのですが、いまいちよく分かりませんでした。
チェックボックスの複数のvalueで、上記の例のような動きを実現させるにはどうしたらいいでしょうか。どなたかご教授ください。

Aベストアンサー

チェックボックスはちょっと特殊

まずHTML部分で、以下のように定義します
<input type="checkbox" name="sample[]" value="test1">test1
<input type="checkbox" name="sample[]" value="test2">test2

ここでは、nameの部分に[]をつけるのがポイント


次にphpで受け取る方法として、
$sample = $_POST["sample"];
で問題ありません。

受け取ったデータを使うときは、$sampleは配列になっていますので、
仮に上記のtest1とtest2両方にチェックが付いているとしたら、
$sample[0]にはtest1が、$sample[1]にはtest2が入っています。

$sampleをforeachで使うか、$sampleのデータ数を調べてforでループさせるなどで使えます。

QonClickに複数の関数を挿入する方法

初心者なのですがアニメーションの関数anime1、anime2、anime3を作成し、onClickに下記のように設定しました。
クリックするとアニメーション2つの設定ではは動くのですが、3つ目を設定すると動かなくなります。
通常はこのような設定はしないものなのでしょうか?
教えてください。
よろしくお願いします。
<INPUT type="button" value="START" onClick="anime1(), anime2()">・・・OKです。
<INPUT type="button" value="START" onClick="anime1(), anime2(),anime3()">・・・動きません。

Aベストアンサー

セミコロンでつなぐのが常道ですが、3つ以上なら
別途function化したほうが、可読性が高くなると
思います。

Qonclickで2個指定するには?

例えば、下記のような二つの指定があるします。

function checkd1(){
document.FORM.CHECK1.checked=true
}
function checkd2(){
document.write("テスト");
}

これをonclickで二つとも指定するということはできるのでしょうか?

<a href="#" onclick="checkd1()">ボタン</a>
<a href="#" onclick="checkd2()">ボタン2</a>

を<a href="#" onclick="checkd1(),checkd2()">ボタン</a>としても動いてくれないので、書き直すのではなく、このまま二つを指定したいのですが、どうすればよいのでしょうか?

Aベストアンサー

><a href="#" onclick="checkd1(),checkd2()">ボタン</a>

<a href="#" onclick="checkd1();checkd2()">ボタン</a>

おしいですね。
, ではなく ; なら両方の関数が呼ばれると思います。
(Firefox3とIE6で確認しました。)

なぜ ; かと言うと、
Javascriptの文法で、文の区切りは ; だからですね。

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

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

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

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


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

Aベストアンサー

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

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

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

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

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

QonClickで関数呼出し後に、結果に応じてsubmitを実行する方法

JavaScriptで、
function func() {
 if (a==0) {
  alert("処理しない");
  return false;
 }
 return true;
}
と、a=0ならfalseを返し、それ以外ならtrueを返す関数を定義しています。

そして、FORMタグで
<FORM NAME="FormName" ACTION="next.html">
<INPUT TYPE="button" VALUE="next" NAME="button1" onClick="return func();submit();">
</FORM>
と記述しています。
要は、ボタンを押下した際にfunc関数がtrueを返せば、next.htmlに
遷移させたいのですが、上記記述では、遷移しません・・・
onClick部分にonClick="return func(),submit();"と記述した場合、
func関数の実行結果がtrueでもfalseでも遷移してしまいます。
そこで、なんとなくonClick="return func()&&submit();"と記述してみたところ、
func関数がtrueの時のみうまく遷移するようになりました。

これは偶然そう動作しているのでしょうか、それとも上記は正しい記述方法なのでしょうか?
正しい記述方法ならいいのですが、上記以外に正式な記述方法があれば
教えていただけないでしょうか?

※TYPE="submit"にすればいいとは思うのですが、buttonで実現したいと
考えております。

JavaScriptで、
function func() {
 if (a==0) {
  alert("処理しない");
  return false;
 }
 return true;
}
と、a=0ならfalseを返し、それ以外ならtrueを返す関数を定義しています。

そして、FORMタグで
<FORM NAME="FormName" ACTION="next.html">
<INPUT TYPE="button" VALUE="next" NAME="button1" onClick="return func();submit();">
</FORM>
と記述しています。
要は、ボタンを押下した際にfunc関数がtrueを返せば、next.htmlに
遷移させたいのですが、上記記述では、遷移しませ...続きを読む

Aベストアンサー

3つのパターンをみる限り、理由は以下の通りと思います。
1.セミコロン(;)で区切った場合、
この場合、「return func();」と「submit();」とは別の文です。returnはその時点の値を戻して、それ以降の動作を打ち切ってしまいます。よって、onClickイベントはfuncメソッドの戻り値(true/false関係なく)を戻して、そこで終了、それ以降のsubmitは実行しないとなります。

2.カンマ(,)で区切った場合、
この場合、「return func(),submit();」が1つの文となります。この「,」は、左右の式を評価して、右式を結果とする演算子です。よって、funcメソッド、submitメソッド両方を評価するため、funcメソッドの戻り値に関係なく、submitされます。

3.&&で区切った場合、
論理演算子「&&」は、左右ともにtrue(0以外)の場合のみtrueとする演算子です。また、2項論理演算子は左式から評価し、左式だけで全体の結果がわかる場合、右式を評価しません。よって、funcメソッドがfalseを戻した場合、その時点でsubmitを評価しなくても演算結果は必ずfalseとなるのでそこで打ち切られ、trueを戻した場合、submitを評価しないと演算結果を得られないため、遷移したわけです。「&&」を「||(論理和)」に変更すると逆の結果得たと思います。

さて、では3の「&&」が正しいかと言われたら、文法上は正しいです。ただし、他人がみてわかるとは思えません。
そこで、以下の記述はいかがでしょう。読んでみてソースを理解できますか。


<FORM NAME="FormName" ACTION="next.html">
<INPUT TYPE="button" VALUE="next" NAME="button1" onClick="func()">
</FORM>

(中略)

// funcの定義
function func() {
 if (a==0) {
  alert("処理しない");
  return ;
 }
 document.FormName.submit();
}

要は、ボタンを押されたら、funcを呼び出せ。
funcでは、aが0ならば、そこで終了しろ。
そうでなければ、documentオブジェクト内のFormNameと言う名前のオブジェクトのsubmitメソッドを呼べ。
です。

3つのパターンをみる限り、理由は以下の通りと思います。
1.セミコロン(;)で区切った場合、
この場合、「return func();」と「submit();」とは別の文です。returnはその時点の値を戻して、それ以降の動作を打ち切ってしまいます。よって、onClickイベントはfuncメソッドの戻り値(true/false関係なく)を戻して、そこで終了、それ以降のsubmitは実行しないとなります。

2.カンマ(,)で区切った場合、
この場合、「return func(),submit();」が1つの文となります。この「,」は、左右の式を評価して、右...続きを読む

QJSPの処理の途中で、JavaScriptの処理をしたい

プログラムをJSPで記述している(<% %>タグ)のですが、
JavaScriptのalertやconfirmなどのポップアップするダイアログを
表示したいのです。それは可能なのでしょうか?

Aベストアンサー

No.2の回答に対する回答(変な日本語ですが)です。

JSPとJavaScriptの処理の行われる順番について考えていないと
エラーになることがありますよ。
大まかな流れは、
 JSPのソースをサーバ側で解釈、実行する(HTMLのソースを吐き出す)
  ↓
 クライアントに生成したソースを送信する
  ↓
 クライアント側のブラウザがソースを解釈する
  ↓
 ソースの中のJavaScriptを、ソースの上のほうから順次実行する
  ↓
 同時に、通常の表示(HTMLの解釈)も実行される

 と、こういう流れですので、例えば、JavaScriptで値を入力し、
JSPでその値を使おうとすると、エラーとなります。

 具体的にやりたいこと(やろうとしていること)を書いていただいたほうが
適切に回答できますが、上記が今考えられるエラーの原因です。

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で配列(複数の要素)を渡したいとき?

こんにちわ,

今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&Aを見た人がよく見るQ&A

人気Q&Aランキング