Q&A
後半のコードのファイル名は「json.php」なのでしょうか。
マップを使ったWEBアプリケーション（図鑑のようなもの）を作りたいと思っています。
php側で登録情報を入力したのち、投稿ボタンを押すとjavascript側の地図にphpで入力した位置にマーカーがプロットされるような仕組みを作りたいです。
現在、php側でのデータベースへの情報登録はできるようになったのですが、phpで入力した情報をJavaScript側に飛ばすことができず困っています。
マーカーのプロットは後回しにして、まずはphp側の緯度経度の情報をjavscript側で変数として受け取れるようになりたいです。アドバイス宜しくお願い致します。
php
1<?php 2//db接続 3$pdo = new PDO($dsn, $user, $password); 4 5//投稿 6if(isset($_POST['submit'])) { 7 $name = $_POST['name']; 8 $comment = $_POST['comment']; 9 $latitude = $_POST['latitude']; 10 $longitude = $_POST['longitude']; 11 12//データベースに値を挿入 13 $sql="INSERT INTO lnglat (name, comment, ido, keido) VALUES (:name, :comment, :ido, :keido)"; 14 $stmt = $pdo->prepare($sql); 15 $params = array(':name' => $name, ':comment' => $comment, ':ido' => $latitude, ':keido' => $longitude); 16 $stmt ->execute($params); 17}//if isset 18 19?> 20 21<!DOCTYPE html> 22<html lang = "ja"> 23<body> 24 <h1>動植物登録フォーム</h1> 25 26<?php 27$latitude=$_POST['latitude']; 28$longitude=$_POST['longitude']; 29?> 30 31<form action = "jsonmap.php" method = "post" enctype="multipart/form-data"> 32緯度経度<br> 33<?php echo "<input type='text' name='latitude' value='". $latitude ."'><br />"; ?> 34<?php echo "<input type='text' name='longitude' value='". $longitude ."'><br />"; ?> <input type="submit" name="submit" value="投稿"> 35</form> 36 37<?php 38$sql = 'SELECT * FROM lnglat'; 39$result = $pdo->query($sql); 40 41//取得したデータを配列に格納 42while($row = $result->fetchObject()){ 43 $users[]=array( 44 'id' => $row->id 45 ,'name' => $row->name 46 ,'comment' => $row->comment 47 ,'ido' => $row->ido 48 ,'keido' => $row->keido 49 ); 50} 51$jsontest = json_encode($users); 52//print_r($jsontest); 53?>
javascript
1<html> 2<body> 3<div id="map"></div> 4<div id="content"></div> 5<script type="text/javascript"> 6//地図生成 7var map = L.map('map'); 8L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', { 9 attribution: "<a href='https://maps.gsi.go.jp/development/ichiran.html' target='_blank'>地理院タイル</a>" 10}).addTo(map); 11map.setView([ , ], 12); 12 13$(document).ready(function(){ 14 $ajax({ 15 type:"POST", 16 url:"json.php", 17 dataType:"json", 18 }).done(function(data,dataType){ 19//帰ってきたデータの表示 20 var $content = $('#content'); 21 for(var i=0; i<data.length: i++){ 22 $content.append("<li>"+data[i].name+"</li>"); 23 } 24 }) 25 26 27}) 28//いろんな方法でやってみましたができません 29var testt = "<?php echo ($jsontest); ?>"; 30console.log(testt); 31var test=JSON.parse('<?php echo $jsontest; ?>'); 32alert(test); 33var testt = "<?php echo ($jsontest); ?>"; 34console.log(testt); 35</script> 36 37</body> 38</html>
分かりにくくてすみません。前半のコードが「json.php」で後半が「jsonmap.php」です。
前半のコードから後半のコードへ通信したいという感じです。
回答2件
0
ベストアンサー
既に回答がありますが、PHPはサーバ側で動く言語です。
実行結果をブラウザに送るまでで処理は終了しています。
jsonmap.phpは現状json.phpからJavaScriptでデータを得るコードになっていて、PHPの部分の記述は全く関係していません。
json.phpも問題があって、jsonmap.phpからAjaxで取得したいのであれば、jsonのみ返す必要があります。（提示された使い方の場合フォームとかHTMLを返してはいけない）
json.phpをとりあえず登録専用にして、別途jsonだけ返す物を作成してください。
投稿2018/12/16 17:03
総合スコア69400
あなたの回答
tips
プレビュー
