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

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

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

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

API

APIはApplication Programming Interfaceの略です。APIはプログラムにリクエストされるサービスがどのように動作するかを、デベロッパーが定めたものです。

配列

配列は、各データの要素(値または変数)が連続的に並べられたデータ構造です。各配列は添え字(INDEX)で識別されています。

Q&A

解決済

1回答

745閲覧

dbのテーブル全てをajaxでhtmlファイルに返したい

kazumad

総合スコア9

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

API

APIはApplication Programming Interfaceの略です。APIはプログラムにリクエストされるサービスがどのように動作するかを、デベロッパーが定めたものです。

配列

配列は、各データの要素(値または変数)が連続的に並べられたデータ構造です。各配列は添え字(INDEX)で識別されています。

0グッド

0クリップ

投稿2021/04/28 14:45

編集2021/04/29 09:06

現在自作apiでdbから取ってきたテーブル全てをajax(json)でhtmlに返す機能を作っていますが
foeachで全件取ってきた後echo json_encode($row_1->fetch_assoc());でhtmlに返すことができません。
試したことはスコープを使って値を全件外に出そうとして失敗 foreachの代わりにwhileを使ったみたが失敗
しました。
お力を貸して頂きたいです。よろしくお願いします。

php

1$sql = "SELECT * FROM `user`"; 2 3$result = $mysqli->query($sql); 4 5foreach ($result as $row) { 6 $row_1 = $row; 7} 8 9header("Content-type: application/json; charset=UTF-8"); 10//JSONデータを出力 11echo json_encode($row_1->fetch_assoc());

受け取り側のファイルを追記します

html

1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="utf-8"> 5 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 6 <title>チャット</title> 7</head> 8 9<body> 10<h1>チャット</h1> 11<p id="user">現在入室しているユーザー 一覧</p> 12<!--この下にユーザー名を追加していく--> 13<ul id="list"> 14<!-- liをここに追加--> 15</ul> 16 <p>名前</p> 17<div><input id="name" type="text" name=""></div> 18<p>メッセージ</p> 19<div><textarea id="chat_submit" type="text" name=""></textarea></div> 20 21<button type="button" id="test_btn">test</button> 22<script> 23 $(function() { 24 //insert API 25 //入室したらランダムな名前を割り振り情報(name,id)がdbに追加される 26 //まずランダム名を割り振るコード 27 let random_name = Math.random().toString(32).substring(2) ; 28 console.log(random_name); 29 let name_data = {'random_name':random_name}; 30 console.log(name_data); 31 32 33 //let tuika = random_name; 34 //変数 連結 35 //$test = "<p>{$hensu}</p>"; 36 // $test = '<p>' . $hensu . '</p>'; 37 //let test = `<p>${hensu}</p>`; 38 // let test = '<p>' + hensu + '</p>'; 39 //$("#user").append(`<p>${tuika}</p>`); 40 41 42 //dbにランダム名を送る 43 $.ajax({ 44 url:'http://localhost:8888/api_user.php', 45 type: "post", 46 //data 送信するデータ(「キー名: 値」のハッシュ形式) 47 dataType:'json', 48 data:name_data, 49 async: true 50 }) 51 .done(function (data) { 52 if(data){ 53 console.log(data); 54 console.log('ユーザー成功'); 55 } 56 // 通信成功時の処理を記述 57 console.log(data); 58 }) 59 .fail(function () { 60 // 通信失敗時の処理を記述 61 //console.log(''); 62 }); 63 //room_member API 64 setInterval(function () { 65 $.ajax({ 66 url: 'http://localhost:8888/room_member.php', 67 type: "get", 68 dataType:'json', 69 //data 送信するデータ(「キー名: 値」のハッシュ形式) 70 async: true 71 }) 72 .done(function (data) { 73 // 通信成功時の処理を記述 74 console.log(data); 75 console.log('一覧成功'); 76 77 //$("ul").append(`<li>${data.name}</li>`); 78 79 $('ul').html(''); 80 81 $.each(data, function(index, element) { 82 $('ul').append(index + ':' + element.name + '<br>'); 83 }); 84 //人数分回す 85 // $('#list').each(function() { 86 // //繰り返し処理を記述する 87 // $("#list").append(`<li>${data.name}</li>`); 88 // }) 89 }) 90 .fail(function () { 91 // 通信失敗時の処理を記述 92 console.log('失敗'); 93 }); 94 }, 5000); 95 //delete API 96 //ウインドウ閉じたらユーザ削除 97 $(window).on('beforeunload', function() { 98 $.ajax({ 99 url:'http://localhost:8888/api_delete.php', 100 type: "post", 101 //data 送信するデータ(「キー名: 値」のハッシュ形式) 102 dataType:"json", 103 data:name_data, 104 async: true 105 }) 106 .done(function (data) { 107 if(data){ 108 console.log(data); 109 console.log('ユーザー成功'); 110 } 111 // 通信成功時の処理を記述 112 console.log(data); 113 }) 114 .fail(function () { 115 // 通信失敗時の処理を記述 116 //console.log(''); 117 }); 118 }); 119 120 121 //select API 122 //submitイベントを使い、フォーム(js-from)が送信された時に処理が実行されるようにイベントを設定。 123 $('#test_btn').on('click', function(){ 124 let name = $('#name').val(); 125 let chat_submit = $('#chat_submit').val(); 126 console.log(name); 127 console.log(chat_submit); 128 let data = { 'name':name, 129 'chat_submit':chat_submit 130 }; 131 console.log(data); 132 $.ajax({ 133 url:'http://localhost:8888/api.php', 134 type: "get", 135 dataType:'json', 136 //data 送信するデータ(「キー名: 値」のハッシュ形式) 137 data:data, 138 async: true 139 }) 140 .done(function (data) { 141 if(data){ 142 console.log('成功'); 143 144 } 145 // 通信成功時の処理を記述 146 console.log(data); 147 }) 148 .fail(function () { 149 // 通信失敗時の処理を記述 150 //console.log(''); 151 }); 152 }); 153 }); 154</script> 155</body> 156</html> 157

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

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

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

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

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

guest

回答1

0

ベストアンサー

幾つか誤解された使い方されてると思いますが、

dbから取ってきたテーブル全てを

SELECT * FROM userで取得されるのは「テーブル」ではなく「レコード」です。
「テーブル」はuser。MySQLでテーブル全て取りたい場合はshow tablesを実行します。

htmlに返すことができません。

Ajaxで返されるのは「呼び出し元」なので、HTMLに限りません。
大抵はJavaScriptなりURLリクエストを送信できるサーバーサイドの言語が「呼び出し元」になります。


コード部分で明らかな箇所。
$row_1 = $row;
上記は「代入」ですから、常に上書きし続けていることになります。

またmysqli::queryが返すのはmysqli_resultなので、そのものをループすることってあまりないと思います。

よく見るのはwhile ($row = $result->fetch_assoc()) {ですね。

デバッガを入れるなり、ログファイルに書き出すなりでデバッグできる仕組みは入れておいた方が良いです。バックグラウンドで実行されるため画面に出力されませんから(JSONに限っている場合、JSON形式不正のエラーは出ることはあるが)


どのような結果を求めていて何が起きているのか分かりませんが、
「SELECTした情報をJSONにして返したい」のでしたら下記で良いのでは。

php

1header("Content-type: application/json; charset=UTF-8"); 2$result = $mysqli->query("SELECT * FROM `user`"); 3echo json_encode($result->fetch_all(MYSQLI_ASSOC)); 4

mysqli_result::fetch_all

可能ならエラーハンドリングもしたいところですね。

php

1 2header("Content-type: application/json; charset=UTF-8"); 3 4try { 5 $result = $mysqli->query("SELECT * FROM `user`"); 6 echo json_encode($result->fetch_all(MYSQLI_ASSOC)); 7} catch (mysqli_sql_exception $e) { 8 echo 'mysqli_sql_exception'.$e->getMessage(); 9 exit; 10} 11

mysqli_sql_exception

投稿2021/04/28 21:40

m.ts10806

総合スコア80765

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

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

kazumad

2021/04/28 22:59

10806さん 無事解決しました。 丁寧親切な回答m.tsありがとうございました。 エラーハンドリングも取り入れみます。
m.ts10806

2021/04/29 01:20

ユーザー名が分割されてますが。
kazumad

2021/04/29 09:08

ご指摘ありがとうございます
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問