- •Занятие 1. "Быстрый старт: организация рабочего места веб-разработчика. Создание и запуск первого проекта"
- •Установка и настройка пакета Denwer
- •Установка среды разработки Eclipse для php
- •Создание и запуск веб-проекта php
- •Добавление php кода к веб-проекту
- •Занятие 2. "Технология верстки веб-страницы: изучениеHtml"
- •Предназначение html иCss
- •Вспомним основные тегиHtml
- •Правила записиHtml-кода
- •Занятие 3. "Технология верстки веб-страницы: изучениеCss"
- •Несколько слов оCss
- •Основы css
- •Посмотрим на результат в браузере (см. Рис. 3.5)
- •Селекторы css
- •Селектор по идентификатору:
- •Селектор по классу:
- •Основной способ подключения css
- •Основные csSстили
- •Из списка стандартных цветов.
- •При помощи указания компонентов цвета: rgb, в этом случае перед компонентами цвета ставится символ "#" – решетка.
- •Проект "Винни-Пух и компания"
- •Технология создания крупного проекта
- •Реализация клиентской части на Java
- •Title - указывается название колонки;
- •Галочка editable - включает/отключает возможность редактирования ячеек колонки пользователем;
- •Галочка resizable - включает/отключает возможность изменения ширины колонки пользователем (см. Рис. Тот же).
- •Обмен данными с сайтом
- •Занятие 5. "Начало создания серверной части проекта"Винни-Пух и компания"
- •Создание серверной части проекта на php
- •Кодировка проектаUtf-8
- •Обработка get-запроса вPhp
- •Работа с MySql изPhp
- •Занятие 6. "Завершение создания php-скрипта для приема данных от клиентской части на Java"
- •ФормированиеSql-запросов из php
- •Занятие 7. "Верстка основного каркаса сайта интернет-магазина"
- •Методики верстки
- •При большой вложенности таблиц друг в друга снижается скорость загрузки страницы браузером.
- •Индексация страницы поисковой системой происходит сложнее, что влияет на оптимизацию сайта для поисковых систем(сайт хуже находится).
- •При открытии страницы в старых браузерах страница может отображаться не корректно –старый браузер не поддерживает современные css- свойства.
- •Типы верстки
- •Верстка основного каркаса сайта
- •Изучение верстки других сайтов
- •Занятие 8. "Создание главного меню и раздела описания товаров"
- •Создание таблицы описания товаров
- •Формирование верхнего горизонтального меню
- •Создание белой прямоугольной области
- •Получение описания товаров из базы данных и вывод на веб-страницу
- •Занятие 9 "Создание левой и правой боковой части страницы"
- •Создание таблицы дляHtml-разметки
- •Программирование пунктов меню
- •Получение html-разметки из базы данных
- •Создание левой боковой части страницы
- •Использование Flash на веб-странице
- •Создание правой боковой части страницы
- •Занятие 10. "ПодключениеJavaScript. Создание разделов сайта: Главная и Контакты"
- •Реализация раздела сайта: Главная
- •Реализация раздела сайта: Контакты
- •Немного оJavaScript
- •Создание эффекта подмены изображения
- •Создание эффекта появления изображения
- •Занятие 11. "Создание раздела сайта: Заказать"
- •Создание верхней части раздела
- •Отправка и получение данных с веб-страницы
- •Использование файлов для хранения данных
- •Открытие файла для записи/чтения;
- •Запись/Чтение;
- •Закрытие файла.
- •Создание функции для получения и сохранения данных
- •Создание таблицы и формы отправки данных
- •Создание тегов для верхней части таблицы с заголовком.
- •Создание функции формирования десяти строк таблицы с остатками.
- •В заключение внешний вид подкорректируем при помощи css.
- •Занятие 12. "Отладка проекта"
- •Кросс-браузерная отладка
- •Посмотреть сайт на различных разрешениях экрана. Для этого необходимо изменять текущее разрешение экрана.
- •/*Вертикальное выравнивание по верхней части*/
- •Создание дополнительных настроек в тегахHead
- •Перенос сайта на веб-сервер
- •Выгрузка базы данных с исходного компьютера.
- •Загрузка базы данных на веб-сервер.
- •Проверка взаимодействия с клиентской частью наJava
- •Заключение
- •Постановка задачи(логическое описание проекта):
- •Техническое описание проекта:
Программирование пунктов меню
Внешний вид пунктов меню создан, но при нажатии не происходит изменения внешнего вида страницы. При переходах по разделам сайта в адресной строке изменяется значение параметраid в GET-запросе.
Например, при переходе в раздел Товары это значение равно единице(см. рис. 9.10).
Рис. 9.10
Задача:В файле lib.phpсоздать функцию для обработки значения из адресной строки с получением значения параметра id.Функция должна возвращать возможные значения: 0,1,2,3–где 1,2,3 значения параметраid, в любом другом случае возвращается 0
Для этого в среде разработки Eclipseдля PHP, в нижней части файла lib.php добавим программный код:
// Получение номера раздела меню
function getIdMenu()
{
// Результат
$tmp=0;
// Если есть данные вGET-запросе
if ($_GET)
{
// Если параметр: id имеет значение вGET-запросе
if ($_GET["id"])
{
// Получаем значение параметра: id
$tmp = $_GET["id"];
}
// Если это значение не лежит в интервале [1..3],
// то записываем нулевое значение в$tmp
if (!(($tmp>=1)&&($tmp<=3))) $tmp=0;
}
// Возвращаем значение из функции
return $tmp;
}
С обработкой параметровGET-запроса мы уже работали. Функция возвращает результат в переменной $tmp. Если возвращаемое значение будет равно нулю, то будет осуществляться переход на главную(домашнюю) страницу.
Проверим работу этой функции –для этого в самом верху в файле index.php добавим вывод результата функции getIdMenu() (см.рис. 9.11):
Рис. 9.11
В браузере выполним переход в каждый из четырех разделов и убедимся, что сверху страницы выводятся правильные цифры: 0,1,2,3 (см.рис. 9.12):
Рис. 9.12
Сравнивайте эту цифру со значением параметра id в адресной строке браузера.
Удалим строку для тестирования функции.
На данный момент в центральной части страницы всегда выводится описание товаров. Применим протестированную функцию и сделаем так,чтобы описание товаров выводилось только при выборе раздела Товары. В файле index.php найдем PHP-вставку с выводом описания товаров. Внесем изменения,получится:
<div id="sheet2">
<?php
// Получаем номер раздела меню
$id_menu = getIdMenu();
if ($id_menu==1) // Если номер: 1 -Товары
{
// Выводим описание товаров
makeOpisan();
}
?>
</div>
В переменную $id_menu запишем информацию о текущем разделе сайта и выводим описание товаров, если выбран раздел Товары.
Посмотрим на результат в браузере. Видим, что при нажатии на пункты меню - описание товаров выводится только в нужном разделе.
Получение html-разметки из базы данных
В таблицу базы данныхrazmetka мы сможем добавлять необходимое количество HTML-фрагментов, каждый из них будет находиться в отдельной строке таблицы. Поле idуникально, для каждой строки таблицы–это номер строки. По номеру можно будет получить нужный фрагмент разметки.
Задача: В файле lib.phpнеобходимо создать функцию, которая по переданному ей номеру получает из базы данных соответствующую разметку и выводит на страницу.
Обратите внимание, что фрагмент кода для работы с базой данных уже находится в функции makeOpisan()–его можно скопировать и использовать в качестве шаблона с внесением некоторых изменений.
Для решения этой задачи в самом низу файла lib.phpнеобходимо добавить новую функцию:
// Получение HTML-разметки из базы данных и вывод на веб-страницу
function getHTML($nom)
{
// Результат работы функции
$html = "";
// Подключаемся кMySQL
$db = mysql_connect(ServerName,UserLogin,UserPassword);
// Если подключение выполнено
if ($db)
{
// Выбираем базу данных с проверкой успешного выбора
if (mysql_select_db(DbName,$db))
{
//Указываем использование кодировки UTF-8
mysql_query("SET names 'utf8'",$db);
//Выполняем запрос для получения данных
$rez = mysql_query("SELECT * FROM razmetka WHERE (id={$nom})");
//Определяем количество строк в результате запроса
$kol_str = mysql_num_rows($rez);
// Если получена одна строка
if ($kol_str==1)
{
//Получаем строку
$row = mysql_fetch_row($rez);
// Получаем значение поля: html
$html = $row[1];
}
}
//Отключаемся от MySQL
mysql_close($db);
}
// Выводим HTML на страницу
echo $html;
}
Подключение к базе данных, формирование запроса и отключение происходит по уже изученной схеме.Разберем новые моменты.
function getHTML($nom)
Функции передается номер строки в таблице, который находится в колонке id. На данный момент в таблице пять строк.
// Результат работы функции
$html = "";
В переменную $html будет получен фрагмент разметки из базы данных,
// Выводим HTML на страницу
echo $html;
который в самом конце работы функции выводится на страницу.
// Выполняем запрос для получения данных
$rez = mysql_query("SELECT * FROM razmetka WHERE (id={$nom})");
Данный SQL-запрос выбирает из таблицы razmetka строку с номером из переменной$nom.
// Если получена одна строка
if ($kol_str==1)
{
//Получаем строку
$row = mysql_fetch_row($rez);
Если строка с таким номером будет найдена, то запрос вернет всего одну строку.
// Получаем значение поля: html
$html = $row[1];
По номеру колонки получаем значение из колонки htmlтаблицы razmetka.
Для того чтобы получить нужный HTML-код, в дальнейшем будет достаточно вызвать функцию getHTML() и передать ей номер фрагмента разметки.
Внимание!!!Программный код файла lib.php увеличивается. Функции с программным кодом можно сворачивать/разворачивать при помощи знака +/- слева от названия функции (см. рис. 9.13)
Рис. 9.13
