- ベストアンサー
メールフォームの送信制御方法と確認メッセージの表示方法
- メールフォームの送信制御方法と確認メッセージの表示方法について説明します。
- enterキーでの送信を制御するために、フォームのonsubmitイベントを利用します。
- 送信ボタンをクリックした際に確認メッセージを表示するために、window.confirmを使います。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
んー onSubmit、onClickがどういう意味なのかを理解していないのね だからこんな頓珍漢なコードになるんだわ それはいずれ勉強してもらうとして そうね 最初に答えを書いちゃいましょうか <script type="text/javascript"> <!-- function check(){ if(window.confirm('送信してよろしいですか？')){ // 確認ダイアログを表示 document.forms[0].submit(); // 「OK」時は送信を実行 } else{ // 「キャンセル」時の処理 window.alert('キャンセルされました'); // 警告ダイアログを表示 // 送信を中止 } } // --> </script> <form method="POST" action="example.cgi"> <input type="button" value="注文" onclick="return check()" /> <input type="reset" value="取消" /> </form> どうしてこうなるのかは頑張って勉強してみてね
その他の回答 (2)
- askaaska
- ベストアンサー率35% (1455/4149)
実際にどういう実装しているのかわからないので アドバイスのしようがないわ
お礼
askaaska 様 度々のコメント有難うございます。 現在試行錯誤でたどり着いたのが <script type="text/javascript"> <!-- function check(){ if(window.confirm('送信してよろしいですか？')){ // 確認ダイアログを表示 return true; // 「OK」時は送信を実行 } else{ // 「キャンセル」時の処理 window.alert('キャンセルされました'); // 警告ダイアログを表示 return false; // 送信を中止 } } // --> </script> <form method="POST" action="example.cgi" onSubmit="return check()"> <input type="button" value="注文" onclick="return check()" /> <input type="reset" value="取消" /> です。 最初の質問に記載したものを組み合わせてみただけなので的外れかもしれませんが現状はここまでしかたどり着けません。 すみませんが現状の問題点をご指摘ください。
- askaaska
- ベストアンサー率35% (1455/4149)
それぞれが なぜそういう動きになるのかを理解すれば おのずと答えは見えてくるものだけど １．がEnterで送信されない理由 送信ボタンがｔｙpe=submitのとき、Enterで送信されてしまう だから送信ボタンをtype=buttonにして、ボタンクリックイベントでformをsubmitするようにした ２．送信前に確認を表示できる理由 formがsubmitされるタイミングで呼び出されるイベントonSubmitで 確認ダイアログを出すJavaScriptをよんでいる じゃあどうすればいいか 送信ボタンをtype=buttonにして、ボタンクリックイベントで 確認ダイアログを出すJavaScriptを呼び そのJavaScriptの中で確認ダイアログで「OK」されたときに formをsubmitすればいい それだけ
お礼
askaaska 様 早速のご教授有難うございます。 自分なりに色々試してみました。 <form method="POST" action="example.cgi" onSubmit="return check()"> <input type="button" value="送信する" onclick="return check()" /> クリックで確認ログがでますが、送信が出来ないところで躓いてます。 多分ここがJavaScriptの中でformをsubmitするという事でしょうか？ JavaScript form submitの組み合わせで検索したサイトを読んでも基礎がない為理解できませんでした。 もう少し検索して勉強してみます。 有難うございました。
補足
未だ解決できておりません。 どなたかお知恵をお貸しください。
お礼
askaaska 様 おはようございます。 度々のアドバイス有難うございます。 最初にいただいた そのJavaScriptの中で確認ダイアログで「OK」されたときにformをsubmitすればいい という部分が出来ていなく、 onSubmit="return check()"とonclick="return check()"を2重に記載していることが問題なのですね。 今日仕事から帰ったら自分のコードとアドバイス頂きましたコードをにらめっこしながら勉強します。 まだ自分で理解していないので完全に解決とはいきませんが、この質問を放置しておくのも無責任ですので一旦締め切ることにします。 今日、明日で勉強してまだ出来ないようでしたら新たに出来ない部分で質問をしてみたいと思います。（出来るだけそのようなことがないように勉強します） 色々と有難うございました。