Использование связки AJAX + JSON
JSON (JavaScript Object Notation) - это формат данных, удобный для обработки интерпретатором JavaScript. Подробнее об формате JSON Вы можете прочитать здесь.
Cледующий файл выбирает все данные из базы MYSQL, преобразует их в json-формат и отправляет AJAX - обработчику.
Обращение к нему с GET-параметрами:
id=номер_записи
tbl=имя_таблицы
json.php
header("Content-Type: application/x-suggestions+json; charset=windows-1251");
//header('Content-type: application/json; charset=utf-8');
// подключение в БД MySQL
require_once($_SERVER['DOCUMENT_ROOT'].'/config.php');
$query = mysql_query('SELECT * FROM '.addslashes($_GET['tbl']).' WHERE id='.intval($_GET['id']).' LIMIT 1');
if($data = mysql_fetch_assoc($query))echo php2json($data);
exit;
// рекурсивная функция формирования json-последовательности.
function php2json($obj){
if(count($obj) == 0) return '[]';
$is_obj = isset($obj[count($obj) - 1]) ? false : true;
$str = $is_obj ? '{' : '[';
foreach ($obj AS $key => $value) {
$str .= $is_obj ? "'" . addcslashes($key, "\n\r\t'\\/") . "'" . ':' : '';
if (is_array($value)) $str .= php2json($value);
elseif (is_null($value)) $str .= 'null';
elseif (is_bool($value)) $str .= $value ? 'true' : 'false';
elseif (is_numeric($value)) $str .= $value;
else $str .= "'" . addcslashes($value, "\n\r\t'\\/") . "'";
$str .= ',';
}
return substr_replace($str, $is_obj ? '}' : ']', -1);
}
Общий блок работы AJAX с поддержкой JSON.
js.js
function ajaxLoad(obj,url,defMessage,post,callback){
var ajaxObj;
if (defMessage) document.getElementById(obj).innerHTML=defMessage;
if(window.XMLHttpRequest){
ajaxObj = new XMLHttpRequest();
} else if(window.ActiveXObject){
ajaxObj = new ActiveXObject("Microsoft.XMLHTTP");
} else {
return;
}
ajaxObj.open ((post?'POST':'GET'), url);
if (post&&ajaxObj.setRequestHeader)
ajaxObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=windows-1251;");
ajaxObj.setRequestHeader("Referer", location.href); // нужен в Donate
ajaxObj.onreadystatechange = ajaxCallBack(obj,ajaxObj,(callback?callback:null));
ajaxObj.send(post);
return false;
}
function updateObj(obj, data, bold, blink){
if(bold)data=data.bold();
if(blink)data=data.blink();
ajaxEval(document.getElementById(obj), data);
}
function ajaxEval(obj, data){
if(obj.tagName=='INPUT'||obj.tagName=='TEXTAREA') obj.value=data;
else if(obj.tagName=='SELECT'){
for(i=0;i<obj.options.length;i++)
if(obj.options[i].value==data){obj.options[i].selected=true;break;}
}else obj.innerHTML = data;
}
function ajaxCallBack(obj, ajaxObj, callback){
return function(){
if(ajaxObj.readyState == 4){
if(callback) if(!callback(obj,ajaxObj))return;
if (ajaxObj.status==200){
if(ajaxObj.getResponseHeader("Content-Type").indexOf("application/x-javascript")>=0)
eval(ajaxObj.responseText);
else if(ajaxObj.getResponseHeader("Content-Type").indexOf('json')>=0){
ajaxObj=eval("(" + ajaxObj.responseText + ")");
for(key in ajaxObj){
o=eval('obj.'+key);
if(typeof(o)!='undefined')ajaxEval(o, ajaxObj[key]);
}
obj.style.display='block'; // до окончания загрузки информации форма скрыта
}else updateObj(obj, ajaxObj.responseText);
}
else updateObj(obj, ajaxObj.status+' '+ajaxObj.statusText,1,1);
}
}}
// функция, осуществляющая JSON-запрос
function edit(id){
document.frm.id.value=id;
document.frm.action='#'+id;
ajaxLoad(document.frm,'json.php?tbl=user&id='+id);
document.frm.name.focus();
return false;
}
Форма, которая будет заполена данными из базы с помощью AJAX запроса:
<form method=post name="frm" style='display:none'>
<input type="hidden" name="id">
Имя, Фамилия: <input type=text name="name" value=""><br />
Телефон: <input type=text name="tel" value=""><br />
Примечание: <input type=text name="comment" value=""><br />
<select name="adm">
<option value="0">Клиент</option>
<option value="5">Сотрудник</option>
<option value="9">Руководитель</option>
</select>
<br>
<input value="Сохранить" type="submit" id='sbt'/>
<input value="Отмена" type="reset" onclick="document.frm.style.display='none';" />
</form>
До окончания загрузки информации форма скрыта.
Вызов формы редактирования записи № 1:
<a href='#' onclick='return edit(1)'>Редактрировать запись № 1</a>
.
Прокомментировать/Отблагодарить