Предыдущие части: PHP и база данных, Идентификаторы, Работаем с таблицами, Создаём базу данных, Установка MySQL
Читайте также: Как работает веб-сайт, Бэкэнд на PHP, Введение в язык PHP
На данный момент у вас должны быть:
- работающий веб-сервер Apache с поддержкой PHP-скриптов
- установленный язык PHP с включённым расширением mysqli
- работающий сервер базы данных MySQL
- база данных cat с таблицей note
Если что-то из этого списка не сделано – все инструкции есть по вышеприведённым ссылкам.
Форма редактирования
До этого мы создавали запись в базе данных руками, набирая команду в консоли MySQL. Это неудобно. Мы сделаем HTML-форму, где можно заполнить поля и отправить данные на сервер.
Таблица note предназначена для хранения заметок и состоит из четырёх столбцов:
id – уникальный идентификатор заметки
date – дата создания заметки
title – заголовок заметки
content – тело заметки
Из них мы будем редактировать руками только два. Столбец id заполняется автоматически, а в столбец date будем просто записывать текущие дату-время.
Значит, форма будет содержать два поля: title и content.
Создадим в папке сайта catalog новый HTML-файл: form.html.
Для лучшей читаемости я буду делать примеры по минимуму, но вам лучше делать корректный HTML5, как обсуждалось ранее.
Теперь вы можете открыть этот файл в браузере по ссылке http://catalog/form.html. Выглядит бедненько, но чистенько:
HTML-элемент <form> это форма, которую мы будем отправлять на сервер. В атрибутах тэга указано method="post", значит будем использовать POST-запрос, и target="update_note.php" – это URL, куда будет отправлен запрос.
Внутри формы есть два текстовых поля. Первое это элемент <input> с атрибутом type="text". Его мы уже проходили, когда делали запрос к Яндексу. Это однострочное текстовое поле для ввода коротких текстов. У него также есть атрибуты:
- name="title" – в POST-запросе элемент будет передан с именем title
- size="64" – размер элемента на экране (должно помещаться 64 символа)
- maxlength="255" – ограничение длины строки, которую можно ввести в это поле
Для ввода тела заметки мы используем элемент <textarea>. Это тоже текстовое поле, только там можно делать переносы строк. В отличие от <input>, этот элемент должен иметь закрывающий тэг: </textarea>. Атрибуты:
- name="content" – в POST-запросе элемент будет передан с именем content
- cols="64" – визуальный размер элемента по ширине (64 столбца)
- rows="8" – визуальный размер элемента по высоте (8 строк)
Наконец, элемент <input type="submit"> выводит на экран кнопку для отправки формы. У него есть атрибут
- value="Сохранить" – на кнопке будет надпись "Сохранить"
Форма также содержит элементы <br>, но они не являются передаваемыми данными, а служат просто для вставки пустых строк между полями формы. Данный способ вёрстки очень топорный, но нам сейчас нужна простота и незамутнённость.
Собственно, с формой всё. После того, как мы заполним поля title и cоntent, мы нажмём кнопку "Отправить", и данные будут через POST-запрос отправлены на сервер Apache, а точнее, на URL, указанный в атрибуте формы target:
http://catalog/update_note.php
Давайте проговорим, что происходит.
- Мы запрашиваем с сервера страницу form.html
- Браузер рисует эту страницу, мы видим на экране форму
- Мы заполняем форму и отправляем на сервер POST-запрос, в котором передаём наши данные, и также просим прислать нам страницу update_note.php
- Apache видит, что мы запрашиваем у него страницу, но это не обычная страница, а PHP-скрипт. Поэтому он не отдаёт нам файл update_note.php как есть. Вместо этого он запускает PHP, который и выполняет этот файл. А вот результат выполнения скрипта (какой угодно) Apache уже вернёт нам в браузер
- Браузер рисует то, что прислали
PHP-скрипт
Теперь нам нужно создать файл update_note.php:
Этот скрипт частично вам знаком, так как с помощью него мы проверяли соединение с базой. Когда Apache запускает скрипт в среде PHP, то передаёт туда данные POST-запроса. Для нашего скрипта они имеют вид ассоциативного массива $_POST. Мы получаем значение поля title как $_POST['title'] и content как $_POST['content'].
Значение поля date мы получаем из функции date(), которая возвращает текущее время в заданном нами формате 'Y-m-d H:i:s'.
Все необходимые поля теперь у нас есть, и мы вставляем их в таблицу с помощью команды INSERT.
Здесь нужна куча оговорок о том, как это всё небезопасно. Также в скрипте отсутствуют элементарные проверки на успех/неуспех, но повторюсь, что сейчас нужна максимальная простота и читаемость. Более надёжный и красивый вариант мы сделаем позже.
Далее по коду, после того, как запись вставлена в таблицу, мы видим, что PHP-код закрывается и начинается HTML-код. Это и есть то, что будет отдано скриптом в браузер. То есть, для браузера это будет выглядеть так, будто он запросил страницу update_note.php и получил вот такое содержимое:
Которое он нарисует примерно так:
Браузер вообще не догадывается о том, что перед тем как отдать ему такой HTML-код, PHP-скрипт творил что хотел. И конечно, PHP-скрипт может как угодно модифицировать и сам отдаваемый HTML. Например, вставить туда id заметки, или в разных ситуациях отдавать вообще разные варианты страницы.
Ну а то, что добавлено скриптом в таблицу, мы пока можем смотреть только через MySQL-консоль. Или использовать скрипт из предыдущего выпуска, которым мы проверяли базу (test_db.php). Чтобы сделать всё красиво в веб-интерфейсе, нам нужно будет всё оптимизировать и систематизировать. Чем мы и займёмся в следующий раз.
Читайте дальше: CRUD