WEB相談室

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

タイトル:confirm()使用時のformタグ内入力値の取り扱いについて

0:[投稿] junaka [MAIL] [2003/11/25 22:35 ][環境:WIN2000、IE6 tomcat4.1]

やりたいことを下記の通りです。

ボタン押下時に確認ダイアログを表示し、
Okの場合  :formタグ内の入力値を持って他の画面へ遷移。
Cancelの場合:画面遷移を行わない。

色々とWebで調べてみたのですが、
一般的なのはJavaScriptを用いた下記の方法でした。
@confirm()の戻り値で分岐
Awindow.locationで画面指定
ここで疑問が。
この場合、inputのtypeは"button"指定となっておりました。
formタグ内の入力値を持って他の画面へ遷移させるには、
"submit"指定でなくてはなりませんよね?
こういった場合はどうしたらよろしいですか?
またformタグで指定した遷移場所は無効なるのですか?
一応、テストとして作成したサンプルは下記の通りです。

<html>
<head>
<title>Confirmダイアログ(HTML)</title>
</head>
<body>
<form method="POST" action="ConfirmTest.jsp">
名前:<input type="text" name="NAMAE">
<input type="button" value="Confirm" onclick="if(confirm('よろしいですか?')) { location.href='ConfirmTest.jsp' }">
</form>
</body>
</html>

また上記のやり方以外の方法がありましたらご教授願います。


1:[回答] Boo [2003/11/26 00:50 ]

formタグ内の入力値を持って他の画面へ遷移させるには、submit()でできます。
<form method="POST" action="ConfirmTest.jsp">
名前:<input type="text" name="NAMAE">
<input type="button" value="Confirm"
onclick="if(confirm('よろしいですか?')) { submit(); }">
</form>


2:[回答] ミツ [2003/11/26 03:43 ]

onsubmitを使えばJavascript を切った状態でも
(ダイアログは出ないけど)操作可能なので良心的かもしれない。
# 場合によっては良心的ではないかもしれないけど。

<form method="POST" action="ConfirmTest.jsp"
onsubmit="return confirm('よろしいですか?')">
名前:<input type="text" name="NAMAE">
<input type="submit" value="送信" >
</form>


3:[関連] junaka [2003/11/26 11:42 ]

To Boo殿&ミツ殿
ありがとうございます。
実装してみましたところ期待通りの動きです。

ちょっと掘り下げて。
onclick="・・・"の・・・はボタンが押下された場合の挙動と考えてよろしいですか?
onclick="location.href='Demo.html'"
は文法的にOKですよね?

というのも、ボタンを2つ横に並べて配置し、
片方は前述のconfirm()でタグ内入力値を持って他画面へ遷移。
もう片方は、何も持たずに他画面へ遷移。
と動作させたいのです。

formタグって</form>で改行が入っちゃいますよね?
ボタンを2つ横に並べて配置したい場合は同一Formタグ内にしないといけませんよね?
その前にこの時点で間違っていますか?


4:[回答] ・・・ [2003/11/26 11:49 ]

submit() をしなければ、 button の onClickイベントではformのデータは送信されません。


5:[回答] Boo [2003/11/26 13:19 ]

Jumpの時は、form内容を送信しないでDemo.htmlに遷移
<form method="POST" action="ConfirmTest.jsp">
名前:<input type="text" name="NAMAE">
<input type="button" value="Confirm" onclick="if(confirm('よろしいですか?')) { submit(); }">
<input type="button" value="Jump" onclick="location.href='Demo.html'">
</form>
>ボタンを2つ横に並べて配置したい場合は同一Formタグ内にしないといけませんよね?
必ずしもそうだとは言い切れませんが、そう考えていただいてもいいと思います。
余力があるようでしたら、デザインや部品の配置などは、スタイルシートを学ばれてみるのもいいでしょう。


6:[関連] junaka [2003/11/26 15:59 ]

To ・・・殿&Boo殿
ありがとうございます。

もう一つ掘り下げて。
<input type="button" value="Jump" onclick="location.href='Demo.html'">
で任意の画面へ遷移というのは確認できました。

そこで、上記のやり方でボタン押下時に新ウィンドウを開いて表示する場合は、
どうしたらよいでしょうか?
onclick部分を使わなければ、target="_blank"指定で実現できますが、
onclick部分があるとtarget="_blank"指定は効かないですよね?
自前メソッド作成ですかね?


7:[完了] junaka [2003/11/26 16:03 ]

解決しました。
<input type="button" value="Jump" onclick="window.open('Demo.html')">
ですね。

貴重なご意見どうもありがとうございました。
次回からは、もうちょっと自分で調べてから投稿させていただきます。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World