質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.30%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

2回答

804閲覧

formから、➀データの送信と、②画面遷移をしたい。

kato00

総合スコア71

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2023/04/20 02:37

編集2023/04/20 07:28

実現したいこと

formから、➀データの送信と、②完了画面へのページ遷移を行いたいが
ページ遷移が行われない

前提

➀formのactionにデータ送信先を指定。データは正常に送られています。
②inputのonclickにkanryougamen.htmlを指定。送信を押してもkanryougamen.htmlに移動しない
③他のjsは正常に動く

該当のソースコード

<form action="データ送信先" method="POST"> <div class="group_outer"> <h2 class="legend">現在の年齢</h2> <div class="input"> <select id="●●●●●●●●" name="●●●●●●●●●●●" title="現在の年齢" required onchange="display_ege()"> <option value="">--なし--</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> </select> </div> </div> <div class="group_outer"> <div class="btn"> <input type="submit" name="submit" value="送信" onclick="location.href='kanryougamen.html'" onClick="return isCheck()"> </div> </div> </form>

コーディング初心者の為、ネットで調べながら進めているのですが、
ここで行き詰りまして、、
ページ遷移されない理由がお分かりになる方いらっしゃいましたら教えて頂けると有難いです。
よろしくお願いします。

追記です

送信ボタンを押した後、➀のデータは、情報管理ツールに正常に流れている事を確認済みです。送信ボタンを押した後、ページがhttps://www.google.com/に移動してしまうので、これをkanryougamen.htmlに変更したいです。

サーバー側のプログラムの書き換えが必要になる場合は、その辺がどうなっているのか全くの不明です。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2023/04/20 07:19 編集

このコメントは回答欄に移しました。
m.ts10806

2023/04/20 07:11

location.href だとデータの送信ではなく画面遷移だけ行われますが、それで良いのでしょうか。
guest

回答2

0

ベストアンサー

formから、➀データの送信と、②完了画面へのページ遷移を行いたいが

単純に html と javascript だけでそれを行うのですか?

「➀データの送信」ということから、送信されたデータを Web サーバーで受け取って何らかの処置を行う Web アプリを作っていると想像していますが、違いますか?

もし、Web アプリの開発をしていて何らかのフレームワークを使っているのであれば、(1) データを検証して検証結果 NG なら元の画面に戻ってエラーメッセージを表示しユーザーに再入力を促す、(2) 検証結果 OK なら POST されたデータを Web サーバ側で受け取って処理が完了したら「②完了画面」へリダイレクトする・・・という機能がフレームワークに備わっているのではないですか? それを調べてみてはいかがですか?

そんな機能は無いということでしたら、自力でコードを書いて、サーバー側で処置が済んだら POST 要求に対して、kanryougamen.html にリダイレクトするなり遷移するなりする応答を返すという話になると思いますが、それは検討範囲外ですか?

投稿2023/04/20 07:19

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kato00

2023/04/20 07:40

ご回答ありがとうございます! 仰る通りでした!機能が備わっていました!! すっかり見落としておりご指摘いただき助かりました!
guest

0

html

1<input type="submit" name="submit" value="送信" 2 onclick="location.href='kanryougamen.html'" onClick="return isCheck()">

onclick 属性が2回書かれていて、2つ目が1つ目を上書きしていると思います。

ところで、この2つをうまいこと1つにまとめても動かないかもしれません。ページ遷移の処理が2つ同時に要求されるので、どちらかがキャンセルされる気がします。kanryougamen.html の内容は、「データ送信先」のコードが返すべきでしょう。

投稿2023/04/20 02:50

int32_t

総合スコア21929

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kato00

2023/04/20 05:04

int32_t様 ご回答ありがとうございます。 なるほど、上書きされてたんですね、、確かに <input type="submit" name="submit" value="送信" onclick="location.href='kanryougamen.html'"> と記載したら画面遷移しました。 onclickを下記のようにまとめてみたのですが、仰る通り、isCheckのみ実行されて、画面遷移はされませんでした。 <input type="submit" name="submit" value="送信" onclick="return isCheck();location.href='kanryougamen.html'"> kanryougamen.html の内容は、「データ送信先」のコードが返すべきでしょう。とのことですが、 下記のように記述するべきという認識であってますでしょうか? <form action="kanryougamen.html" method="POST"> このように記載すると、今度はデータが送信されなくなるのですが、、 こちらはどうのようにすると良いのかアドバイス頂けますと幸いです。 認識違いましたら仰ってください。 よろしくお願いいたします。
int32_t

2023/04/20 05:17

> 下記のように記述するべきという認識であってますでしょうか? > <form action="kanryougamen.html" method="POST"> いいえ、違います。そこは書き換えないべきです。 質問文の最初の状態では kanryougamen.html に遷移せずに「データ送信先」の処理結果が表示されていたはずです。サーバ側のプログラムを書き換えて、その表示を目的のものに置き換えましょう。 サーバ側のプログラムを変更することが不可能なら、そのように質問を更新しましょう。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.30%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問