DBに登録しているユーザーの名前を、3名分表示するコード(7月4日)
DBに登録しているユーザーの名前を、3名分表示するコード。JQueryとPHPを使って実装。PHPはユーザーデータのJSONを返すだけのAPIとなっている。
index.html
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title></title> <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> </head> <body> <ul> <li> <a href="" id="intro1"></a> </li> <li> <a href="" id="intro2"></a> </li> <li> <a href="" id="intro3"></a> </li> </ul> <script> //3人の他ユーザーを表示する際のデータを取得 jQuery.get('user.php', function(data) { var user_data = data['data']; jQuery('#intro1').html(user_data[0]['name']); jQuery('#intro2').html(user_data[1]['name']); jQuery('#intro3').html(user_data[2]['name']); }); </script> </body> </html>
user.php
<?php $svn = 'localhost'; $dbname = ''; $pass = ''; $user = ''; $link = mysqli_connect($svn, $user, $pass, $dbname) or die("エラー"); $sql = 'select * from user'; $query = mysqli_query($link, $sql) or die('test'); $data = array(); $data_all = array(); while ($row = mysqli_fetch_array($query)) { //id,nameカラムを配列に入れる $data['id'] = $row['id']; $data['name'] = $row['name']; $data_all[]=$data; } $var = array('res'=>'succes', 'data'=>$data_all); header("Content-Type: application/json; charset=utf-8"); echo json_encode($var); ?>
うーん、APIから取得したJSONをそのまま使っているのは大丈夫なのだろうか。明日調べてみよう。