(转)PHP および AJAX MySQL データベースの例-PHPチュートリアル-php.cn

(转)PHP および AJAX MySQL データベースの例

WBOY

リリース： 2016-06-23 14:33:10

オリジナル

961 人が閲覧しました

参照地址:http://www.w3schools.com/PHP/php_ajax_database.asp

AJAX はデータベースとの対話型通信に使用できます。

AJAX データベースの例

以下の AJAX の例ではAJAX テクノロジーを使用して Web ページが MySQL データベースから情報を取得する方法を説明します。

下のボックスで名前を選択します

ユーザーを選択します: Peter Griffin Lois Griffin Joseph Swanson Glenn Quagmire

ユーザー情報は次のようになりますここにリストされています。

この例は 4 つの要素で構成されています:

MySQL データベース単純な HTML フォーム JavaScript フォーム PHP ページ

データベース

この例で使用するデータベースは次のようになります:

id FirstName LastName年齢出身地仕事

1	ピーター	グリフィン	41	クアホッグ	醸造所
2	ロイス	グリフin	40	ニューポート	ピアノ教師
3	ジョセフ	スワンソン	39	クアホッグ	警察官
4	グレン	泥沼	41	クォホッグ	パイロット

HTML フォーム

上記の例単純な HTML フォームと JavaScript へのリンクが含まれています:

<html>            <head>            <script src="selectuser.js"></script>            </head>            <body>

ログイン後にコピー

<form>            Select a User:            <select name="users" onchange="showUser(this.value)">            <option value="1">Peter Griffin</option>            <option value="2">Lois Griffin</option>            <option value="3">Glenn Quagmire</option>            <option value="4">Joseph Swanson</option>            </select>            </form>

ログイン後にコピー

<p>            <div id="txtHint"><b>User info will be listed here.</b></div>            </p>

ログイン後にコピー

</body>            </html>

ログイン後にコピー

例の説明 - HTML フォーム

ご覧のとおり、これはドロップダウンボックスを備えた単純な HTML フォームです。オプション値としてデータベースからの名前と「id」を持つ「users」と呼ばれます。

フォームの下の段落には、「txtHint」という div が含まれています。 div は、Web サーバーから取得した情報のプレースホルダーとして使用されます。

ユーザーがデータを選択すると、「showUser()」と呼ばれる関数が実行されます。関数の実行は、「onchange」イベントによってトリガーされます。

言い換えると、ユーザーがドロップダウンボックスの値を変更するたびに、関数 showUser() が呼び出されます。

JavaScript

これは、ファイル「selectuser.js」に保存されている JavaScript コード:

var xmlHttp

ログイン後にコピー

function showUser(str)            {            xmlHttp=GetXmlHttpObject()            if (xmlHttp==null)            {            alert ("Browser does not support HTTP Request")            return            }            var url="getuser.php"            url=url+"?q="+str            url=url+"&sid="+Math.random()            xmlHttp.onreadystatechange=stateChanged            xmlHttp.open("GET",url,true)            xmlHttp.send(null)            }

ログイン後にコピー

function stateChanged()            {            if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")            {            document.getElementById("txtHint").innerHTML=xmlHttp.responseText            }            }

ログイン後にコピー

function GetXmlHttpObject()            {            var xmlHttp=null;            try            {            // Firefox, Opera 8.0+, Safari            xmlHttp=new XMLHttpRequest();            }            catch (e)            {            //Internet Explorer            try            {            xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");            }            catch (e)            {            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");            }            }            return xmlHttp;            }

ログイン後にコピー

例の説明

stateChanged() 関数と GetXmlHttpObject 関数は PHP AJAX の関数と同じです章、できますこれらの説明については、そこにアクセスしてください。

showUser() 関数

ドロップダウンボックス内の項目が選択されている場合、関数は以下を実行します:

GetXmlHttpObject 関数を呼び出して XMLHTTP オブジェクトを作成します URL (ファイル名) を定義します) をサーバーに送信しますドロップダウンボックスの内容を含むパラメーター (q) を URL に追加しますサーバーがキャッシュされたファイルを使用しないように乱数を追加します変更がトリガーされたときに stateChanged を呼び出します指定された URL で XMLHTTP オブジェクトを開きます。 HTTP リクエストをサーバーに送信します

PHP ページ

JavaScript によって呼び出されるサーバーページは、「getuser.php」という単純な PHP ファイルです。

このページは PHP で書かれており、MySQL データベースを使用します。

コードはデータベースに対して SQL クエリを実行し、結果を HTML テーブルとして返します:

<?php            $q=$_GET["q"];            $con = mysql_connect('localhost', 'peter', 'abc123');            if (!$con)            {            die('Could not connect: ' . mysql_error());            }            mysql_select_db("ajax_demo", $con);            $sql="SELECT * FROM user WHERE id = '".$q."'";            $result = mysql_query($sql);            echo "<table border='1'>            <tr>            <th>Firstname</th>            <th>Lastname</th>            <th>Age</th>            <th>Hometown</th>            <th>Job</th>            </tr>";            while($row = mysql_fetch_array($result))            {            echo "<tr>";            echo "<td>" . $row['FirstName'] . "</td>";            echo "<td>" . $row['LastName'] . "</td>";            echo "<td>" . $row['Age'] . "</td>";            echo "<td>" . $row['Hometown'] . "</td>";            echo "<td>" . $row['Job'] . "</td>";            echo "</tr>";            }            echo "</table>";            mysql_close($con);            ?>

ログイン後にコピー

例の説明

クエリが JavaScript から PHP ページに送信されると、次のことが起こります:

PHP MySQL サーバーへの接続を開きます指定された名前の「ユーザー」が見つかりますテーブルが作成され、データが挿入され、「txtHint」プレースホルダーに送信されます