javascriptで別ページのラジオボタンのvalue値を取得し表示する方法

現在PHPを使用してお問い合わせフォームを作っており、
入力画面(index.php)→確認画面(confirm.php)→完了画面とするつもりです。

そこで、入力画面でラジオボタンを使用し二択のどちらかを選択してもらい、
選択してもらった方のlabel内のテキストを確認画面にて表示したく試してみたのですが、
なかなかできません。

試行した方法は、index.phpのname="choose"をconfirm.phpでJavascriptを使用して取得し、
.appendでhtml内に出力してみましたが上手くいきませんでした。

コードは下記になります。

index
1<form action="<?php print CONTACT_INDEX; ?>" method="post" name="mailform">
2
3<!--～～～～～～中略～～～～～～-->
4
5<label><input type="radio" id="choose" name="choose" value="<?php if ($data['choose'] != "") print $data['choose']; ?>">お仕事のお問い合わせ</label>
6<label><input type="radio" id="choose" name="choose" value="<?php if ($data['choose'] != "") print $data['choose']; ?>">採用のお問い合わせ</label>
7
8<!--～～～～～～中略～～～～～～-->
9
10</form>

confirm
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4<script type="text/javascript" src="../js/jquery-1.9.1.js"></script>
5<script>
6    $(function(){
7      $.ajax({
8        url: 'index.php',
9        cache: false,
10        datatype: 'php',
11        success: function(html) {
12            var h = $("input[name='choose']:checked").parent().text();
13            $('#wrap').append(h);
14        }
15      });
16    });
17  </script>
18</head>
19<body>
20<table class="tbl_cmn" cellpadding="0" cellspacing="0">
21<tr>
22    <th><label>選択 <span class="red">※必須</span></label></th>
23    <td id="wrap"></td>
24</tr>
25</table>
26</body>
27</html>

javascript phpともに初心者のためお力添えいただけますと幸いです。

もし、上記の方法以外に
入力画面(index.php)のラジオボタンの入力値を取得し、確認画面(confirm.php)にテキストを出力できる方法がありましたら、ご教授いただけますと幸いです。

何卒、よろしくお願い致します。

～～～～～～～～～～～～　補足　～～～～～～～～～～～～

cofirm
1<script>
2    $(function(){
3      $.ajax({
4        url: 'https://○○.com/test/contact/',
5        cache: false,
6        datatype: 'html',
7        success: .done(function(html) {
8            var h = $("input[name='choose']:checked").parent().text();
9            $('#wrap').append(h);
10        });
11      });
12    });
13  </script>

ご指摘を受けてjavascriptを上記に修正致しましたが上手くいきませんでした。
違っている点などがありましたらご教授いただけますと幸いです。

行動規範の内容に同意します

回答2件

javascriptで別ページのラジオボタンのvalue値を取得し表示する方法

入力画面(index.php)→確認画面(confirm.php)→完了画面とするつもりです。

URL が http://example.com/index.php から http://example.com/confirm.php にページ遷移するケースと解釈して回答します。

JavaScript では遷移前のページ情報を取得することはできません。
セキュリティ上の理由です（遷移前のフォーム情報を取得できると、個人情報/カード情報が抜かれます）。

ブラウザは、ページを開くたびに <script> タグを解釈することによって、JavaScriptを実行（起動）します。
ページが遷移したり、読み直したりすると、JavaScript はゼロから実行して危険を回避しています。

javascript phpともに初心者

ページ遷移する場合、例えば、以下のようなページ遷移図を考え、PHP側も相応のHTMLを応答する実装にします。
JavaScript の使いどころは入力画面でバリデーションし、再入力を促すサーバー処理を発生させないことでしょうか。

        POST                      POST
入力画面 --->[確認処理]---> 確認画面 --->[受理処理]---> 完了画面
index.php   confirm.php              thanks.php
   ^            |                (DB更新+利用者へ通知)
   +------------+ (再入力を促す)      

※[] 内はサーバー実装

投稿2020/04/17 07:25

編集2020/04/17 07:27