Использование связки AJAX + JSON

JSON (JavaScript Object Notation) - это формат данных, удобный для обработки интерпретатором JavaScript.

Cледующий файл выбирает все данные из базы MYSQL, преобразует их в json-формат и отправляет AJAX - обработчику. Обращение к нему с GET-параметрами:

id=номер_записи
tbl=имя_таблицы
json.php
<?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>
Теги:
AJAX, JSON
Добавлено: 05 Июля 2018 08:02:53 Добавил: Андрей Ковальчук Нравится 0
Добавить
Комментарии:
Нету комментариев для вывода...