html で <p id=res></p> に値がセットされているものを php で変数として使用することついて

画像のようにtableを作りました。時間で区切ってあるtableをクリックした際にポップアップに時間を引き渡したいのですが、引き渡しができません。
具体的には、上段のtableの13：00の箇所をクリックした際にポップアップされて開始時間を13：00とし、終了時間を13：30としたいと思っていますが、引き渡しができません。
html で <p id=res></p> に値がセットされているものを php で変数として使用することは可能な事は調べてわかったのですが、具体的なやり方がわかりません。

やったことは以下の通りです。

呼び出し元の php(aとする) から画面でクリックしたセルの位置を引き渡す

以下　javascript

function add(x,y,h) {

    var data = x.cellIndex; // 渡したいデータ

    id = data;
    $.ajax({
        type: "POST",
        url: "ajax.php",
        data: { "id" : id },
        dataType : "json"
    }).done(function(data){
        $("#res").text(data.id);
    }).fail(function(XMLHttpRequest, textStatus, error){
        alert(error);
    });
  }

以下　ajax.php

<?php
  session_start();


  // 画面から送られたきた値
  $id = filter_input(INPUT_POST, 'id');    // $_POST['id']とも書ける

  $_SESSION['id'] = $id; 

  $list = array("id" => $id);

  // 明示的に指定しない場合は、text/html型と判断される
  header("Content-type: application/json; charset=UTF-8");

  //JSONデータを出力
  echo json_encode($list);


  exit;
?>

以下　遷移先（a）の php　

<div id="mask" class="hidden"></div>
   <section id="modal" class="hidden">


  これをphpの変数として処理したい
　<p id=res></p>

　処理内容
　　
  </section>
  <script src="script.js"></script>

やりたいことは a からポップアップを表示しており、その場所でクリックしたセルの情報を
php の変数として処理したいです。
セッション変数にも代入したのですが、ポップアップを閉じた後にしか値が反映しません。

<?php
session_start();
$id = filter_input(INPUT_POST, 'id');
$_SESSION['id'] = $id;
$list = array("id" => $id);
$json = json_encode($list);
file_put_contents('input_post_id.txt', $id);
file_put_contents('response_json.txt', $json);
header("Content-type: application/json; charset=UTF-8");
die($json);

<div id="res"></div> にはいっている値 "5" の場合、

下記の html で

<option value="5" cheked>11:00</option> としたい場合どのように記述すればよいでしょうか。

<div id="mask" class="hidden"></div>
   <section id="modal" class="hidden">
           <form method="POST" action="schedule.php" name="formName">
           <div class="contentsinner2">
                <table class="Customer6">
                    <tbody>
                        <tr>
                            <td class="MEtd124"><button onclick="zikko(); return false;" style="" type="button" class="nav20">予定を入れる</button></td>
                            <td class="MEtd124"><button onclick="zikko(); return false;" style="" type="button" class="nav20">キャンセル</button></td>
                            <td class="MEtd124"></td>
                            <td class="MEtd124"></td>
                            <td class="MEtd124"></td>
                            <td class="MEtd125"><button onclick="location.href = ''" style="" type="button" class="nav21">Ｘ</button></td>
                        </tr>
                    </tbody>
                </table>
                <div class="clear"><br></div><!-- フロート解除 -->
                <table class="Customer5">
                    <tbody>

                        <tr>
                            <td class="MEtd25">
                                開始時間　
                                <select name="stime" class="SelectName">
                                    <option value="1">9:00</option>
                                    <option value="2">9:30</option>
                                    <option value="3">10:00</option>
                                    <option value="4">10:30</option>
                                    <option value="5">11:00</option>
                                    <option value="6">11:30</option>
                                    <option value="7">12:00</option>
                                    <option value="8">12:30</option>
                                    <option value="9">13:00</option>
                                    <option value="10">13:30</option>
                                    <option value="11">14:00</option>
                                    <option value="12">14:30</option>
                                    <option value="13">15:00</option>
                                    <option value="14">15:30</option>
                                    <option value="15">16:00</option>
                                    <option value="16">16:30</option>
                                    <option value="17">17:00</option>
                                    <option value="18">17:30</option>
                                    <option value="19">18:00</option>
                                    <option value="20">18:30</option>
                                </select>　
                                終了時間　
                                <select name="etime" class="SelectName">
                                    <option value="1">9:00</option>
                                    <option value="2">9:30</option>
                                    <option value="3">10:00</option>
                                    <option value="4">10:30</option>
                                    <option value="5">11:00</option>
                                    <option value="6">11:30</option>
                                    <option value="7">12:00</option>
                                    <option value="8">12:30</option>
                                    <option value="9">13:00</option>
                                    <option value="10">13:30</option>
                                    <option value="11">14:00</option>
                                    <option value="12">14:30</option>
                                    <option value="13">15:00</option>
                                    <option value="14">15:30</option>
                                    <option value="15">16:00</option>
                                    <option value="16">16:30</option>
                                    <option value="17">17:00</option>
                                    <option value="18">17:30</option>
                                    <option value="19">18:00</option>
                                    <option value="20">18:30</option>
                                </select>
                            </td>
                        </tr>
                        <input type=hidden name=popup value=1 />
                        <input type=hidden name=simei_1 value="予約有" />
                        <input type=hidden name=kanji_1 value="予約有" />
                     </tbody>
                </table>
            </div>
        </div>
  </form>

kei344

2021/05/22 03:02

teratailは質問内容の編集ができるので、変更がある場合は新しい質問をするのではなく編集してください。また、こちらの質問を削除されるよう運営に連絡されることをお勧めします。 https://teratail.com/help#delete-question https://teratail.com/contact/input