Получение данных с помощью JQuery, AJAX и PHP из базы данных MySQL

Я пытаюсь выяснить, как извлекать данные из базы данных MySQL, используя вызов AJAX на страницу PHP. Я слежу за этим уроком

http://www.ryancoughlin.com/2008/11/04/use-jquery-to-submit-form/

Но я не могу понять, как заставить его отправлять обратно данные json, чтобы я мог его прочитать.

Прямо сейчас у меня есть что-то вроде этого:

$('h1').click(function() { $.ajax({ type:"POST", url: "ajax.php", data: "code="+ code, datatype: "xml", success: function() { $(xml).find('site').each(function(){ //do something }); }); }); 

Мой PHP, я думаю, будет что-то вроде этого

  <?php include ("../../inc/config.inc.php"); // CLIENT INFORMATION $code = htmlspecialchars(trim($_POST['lname'])); $addClient = "select * from news where code=$code"; mysql_query($addClient) or die(mysql_error()); ?> 

В этом учебном руководстве показано, как вставлять данные в таблицу, но мне нужно читать данные. Может ли кто-нибудь указать мне в хорошем направлении?

Благодаря,

Craig

Ничего другого. Просто делайте свои вещи для получения данных в ajax.php, как обычно. и отправьте ответ в своем контейнере на странице.

как описано здесь:

http://openenergymonitor.org/emon/node/107

http://www.electrictoolbox.com/json-data-jquery-php-mysql/

Прежде всего, я бы настоятельно рекомендовал использовать объект JS для переменной данных в запросах ajax. Это сделает вашу жизнь намного проще, когда у вас будет много данных. Например:

 $('h1').click(function() { $.ajax({ type:"POST", url: "ajax.php", data: { "code": code }, datatype: "xml", success: function() { $(xml).find('site').each(function(){ //do something }); }); }); 

Что касается получения информации с сервера, сначала вам придется сделать PHP-скрипт, чтобы вытащить данные из db. Если вы предполагаете получить много информации с сервера, то, кроме того, вы можете сериализовать свои данные в XML или JSON (я бы пересчитал JSON).

В вашем примере я буду считать, что ваша таблица db очень маленькая и простая. Доступные столбцы: id, code и description. Если вы хотите вывести все описания новостей для определенного кода, ваш PHP может выглядеть так. (Я не делал PHP некоторое время, поэтому синтаксис может быть неправильным)

 // create data-structure to handle the db info // this will also make your code more maintainable // since OOP is, well just a good practice class NewsDB { private $id = null; var $code = null; var $description = null; function setID($id) { $this->id = $id; } function setCode($code) { $this->code = $code; } function setDescription($desc) { $this->description = $desc; } } // now you want to get all the info from the db $data_array = array(); // will store the array of the results $data = null; // temporary var to store info to // make sure to make this line MUCH more secure since this can allow SQL attacks $code = htmlspecialchars(trim($_POST['lname'])); // query $sql = "select * from news where code=$code"; $query = mysql_query(mysql_real_escape_string($sql)) or reportSQLerror($sql); // get the data while ($result = mysql_fetch_assoc($query)) { $data = new NewsDB(); $data.setID($result['id']); $data.setCode($result['code']); $data.setDescription($result['description']); // append data to the array array_push($data_array, $data); } // at this point you got all the data into an array // so you can return this to the client (in ajax request) header('Content-type: application/json'); echo json_encode($data_array); 

Выход образца:

 [ { "code": 5, "description": "desc of 5" }, { "code": 6, "description": "desc of 6" }, ... ] 

Таким образом, на этом этапе у вас будет PHP-скрипт, который возвращает данные в JSON. Также foo.php что URL-адрес этого PHP-скрипта – foo.php .

Затем вы можете просто получить ответ от сервера:

 $('h1').click(function() { $.ajax({ type:"POST", url: "foo.php", datatype: "json", success: function(data, textStatus, xhr) { data = JSON.parse(xhr.responseText); // do something with data for (var i = 0, len = data.length; i < len; i++) { var code = data[i].code; var desc = data[i].description; // do something } }); }); 

Это все.