Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
МУ к лаб раб web-программирование.doc
Скачиваний:
448
Добавлен:
07.06.2015
Размер:
4.4 Mб
Скачать

Задание на работу:

  1. Выполнить настройку АМР-платформы: установить пакет, состоящий из приложений - сервера Apache, сервера баз данных MySQL, интерпретатора PHP (возможна установка существующий пакетов Denver, XAMP, WAMP и т.д.)

  2. Рассмотреть параметры основных файлов конфигурации веб-сервера Apache http.conf и интерпретатора php php.ini, выполнить настройку сервера Appach для работы web-приложений

  3. На основе сформированного списка задач в лабораторной работе 1 выполнить следующее:

  • реализовать crud операции (create, read, update, delete) над выбранной сущностью предметной области (моделью) в бэк-энд модуле приложении, используя возможности «классического» php;

  • реализовать две задачи из составленного списка задач во front-end части веб-приложения, используя возможности шаблонизатора Smarty.

Лабораторная работа №7 Использование Ajax и js библиотек

Цель работы: получить практические разработки приложений с использованием технологии Ajax и JS библиотек

Теоретические сведения

AJAX означает "Asynchronous JavaScript and XML", т.е. Асинхронный JavaScript и XML. В действительности AJAX состоит из JavaScript, как и любое другое приложение, и соединения XMLHTTP с Web-сервером. Вот и все! Общая идея заключается в том, что можно извлекать с сервера данные просто по мере необходимости, не обновляя всю страницу.

Прежде всего AJAX почти всегда опирается на серверный язык, такой, как PHP или ASP. Когда пользователю необходимо получить новые данные, JavaScript запрашивает их, а сервер, вероятно, запросит базу данных и затем вернет данные. Эти данные можно вернуть в различной форме. Если они структурированы, то это будут обычно данные XML или JSON. Если это очень простые данные (такие, как получение описания какого-то объекта), то можно часто увидеть людей, которые просто записывают эти данные непосредственно в ответ AJAX.

Приложения AJAX могут выполняться только в Web-браузерах с поддержкой XML.

Поддержка ajax браузерами

Приложения AJAX могут выполняться только в Web-браузерах с полной поддержкой XML, т.е. всеми основными современными браузерами.

Предыдущий пример вызывает функцию с именем GetXmlHttpObject.

Эта функция предназначена для решения проблемы создания различных объектов XMLHTTP для различных браузеров.

Функция имеет следующий код:

function GetXmlHttpObject(handler)

{

var objXMLHttp=null

if (window.XMLHttpRequest)

{

objXMLHttp=new XMLHttpRequest()

}

else if (window.ActiveXObject)

{

objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")

}

return objXMLHttp

}

.

Страница html для примера ajax

Эта страница HTML содержит простую форму HTML и ссылку на файл JavaScript.

<html>

<head>

<script src="clienthint.js"></script>

</head>

<body>

<form>

Имя:

<input type="text" id="txt1"

onkeyup="showHint(this.value)">

</form>

<p>Советуем: <span id="txtHint"></span></p>

</body>

</html>

Код JavaScript приложения ajax

Это код JavaScript, который находится в файле "clienthint.js":

var xmlHttp

function showHint(str)

{

if (str.length==0)

{

document.getElementById("txtHint").innerHTML=""

return

}

xmlHttp=GetXmlHttpObject()

if (xmlHttp==null)

{

alert ("Браузер не поддерживает запросы HTTP")

return

}

var url="gethint.asp"

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 objXMLHttp=null

if (window.XMLHttpRequest)

{

objXMLHttp=new XMLHttpRequest()

}

else if (window.ActiveXObject)

{

objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")

}

return objXMLHttp

}

Далее речь пойдет о серверной странице AJAX.