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

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

ただいまの
回答率

90.23%

phpからjavascriptへの値の受け渡し

解決済

回答 2

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 986

ohayou

score 12

マップを使ったWEBアプリケーション(図鑑のようなもの)を作りたいと思っています。
php側で登録情報を入力したのち、投稿ボタンを押すとjavascript側の地図にphpで入力した位置にマーカーがプロットされるような仕組みを作りたいです。

現在、php側でのデータベースへの情報登録はできるようになったのですが、phpで入力した情報をJavaScript側に飛ばすことができず困っています。

マーカーのプロットは後回しにして、まずはphp側の緯度経度の情報をjavscript側で変数として受け取れるようになりたいです。アドバイス宜しくお願い致します。

<?php
//db接続
$pdo = new PDO($dsn, $user, $password);

//投稿
if(isset($_POST['submit'])) {
   $name      = $_POST['name'];
   $comment   = $_POST['comment'];
   $latitude  = $_POST['latitude'];
   $longitude = $_POST['longitude'];

//データベースに値を挿入
  $sql="INSERT INTO lnglat (name, comment, ido, keido) VALUES (:name, :comment, :ido, :keido)";
  $stmt = $pdo->prepare($sql);
  $params = array(':name' => $name, ':comment' => $comment, ':ido' => $latitude, ':keido' => $longitude);
  $stmt ->execute($params);
}//if isset

?>

<!DOCTYPE html>
<html lang = "ja">
<body>
  <h1>動植物登録フォーム</h1>

<?php
$latitude=$_POST['latitude'];
$longitude=$_POST['longitude'];
?>

<form action = "jsonmap.php" method = "post" enctype="multipart/form-data">
緯度経度<br>
<?php echo "<input type='text' name='latitude' value='". $latitude ."'><br />"; ?>
<?php echo "<input type='text' name='longitude' value='". $longitude ."'><br />"; ?>     <input type="submit" name="submit" value="投稿">
</form>

<?php
$sql = 'SELECT * FROM lnglat';
$result = $pdo->query($sql);

//取得したデータを配列に格納
while($row = $result->fetchObject()){
    $users[]=array(
        'id' => $row->id
        ,'name' => $row->name
        ,'comment' => $row->comment
        ,'ido' => $row->ido
        ,'keido' => $row->keido
    );
}
$jsontest = json_encode($users);
//print_r($jsontest);
?>
<html>
<body>
<div id="map"></div>
<div id="content"></div>
<script type="text/javascript">
//地図生成
var map = L.map('map');
L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', {
  attribution: "<a href='https://maps.gsi.go.jp/development/ichiran.html' target='_blank'>地理院タイル</a>"
}).addTo(map);
map.setView([  ,  ], 12);

$(document).ready(function(){
  $ajax({
    type:"POST",
    url:"json.php",
    dataType:"json",
  }).done(function(data,dataType){
//帰ってきたデータの表示
    var $content = $('#content');
    for(var i=0; i<data.length: i++){
      $content.append("<li>"+data[i].name+"</li>");
    }
  })


})
//いろんな方法でやってみましたができません
var testt = "<?php echo ($jsontest); ?>";
console.log(testt);
var test=JSON.parse('<?php echo $jsontest; ?>');
alert(test);
var testt = "<?php echo ($jsontest); ?>";
console.log(testt);
</script>

</body>
</html>
  • 気になる質問をクリップする

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • kei344

    2018/12/13 22:43

    後半のコードのファイル名は「json.php」なのでしょうか。

    キャンセル

  • ohayou

    2018/12/13 23:11

    分かりにくくてすみません。前半のコードが「json.php」で後半が「jsonmap.php」です。
    前半のコードから後半のコードへ通信したいという感じです。

    キャンセル

回答 2

checkベストアンサー

0

既に回答がありますが、PHPはサーバ側で動く言語です。
実行結果をブラウザに送るまでで処理は終了しています。
jsonmap.phpは現状json.phpからJavaScriptでデータを得るコードになっていて、PHPの部分の記述は全く関係していません

json.phpも問題があって、jsonmap.phpからAjaxで取得したいのであれば、jsonのみ返す必要があります。(提示された使い方の場合フォームとかHTMLを返してはいけない
json.phpをとりあえず登録専用にして、別途jsonだけ返す物を作成してください。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/12/17 16:59

    回答ありがとうございました。別のやり方で解決しました。

    キャンセル

0

PHPは、サーバ側で動いてます。うごていると言っても、ブラウザ側からのアクセションで受動的に動作します。
ところが、javascriptは、ブラウザ側で動いてます。
なので、PHPからjavascriptに値を渡すのではなく、
javascript側からサーバに、取りに行く(ajax)のが普通です。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2018/12/17 16:59

    回答ありがとうございました。

    キャンセル

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

  • ただいまの回答率 90.23%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

同じタグがついた質問を見る