FAQ з використанням PHP-jQuery і текстових файлів. Частина 2

2

Від автора: У другій частині циклу уроків по створенню FAQ з використанням текстових файлів БД ми приступимо до написання нескладної адміністративної частини, через яку можна буде додавати нові пари питання-відповідь і видаляти ті, які вже не потрібні. Відповідно, наша адмінка буде включати в себе 2 пункту, перший з яких буде реалізовано в поточному уроці, а другий пункт — в 3-ем (заключному) уроці циклу.

Отже, приступимо…

План уроку:

1. Створюємо форму додавання даних (12:28)

2. Пишемо обробник. Частина 1 (11:12)

3. Пишемо обробник. Частина 2 (11:36)

4. Пишемо обробник. Частина 3 (13:23)

FAQ з використанням PHP-jQuery і текстових файлів. Частина 2FAQ з використанням PHP-jQuery і текстових файлів. Частина 2

 

1. Створюємо форму додавання даних

Перше, що нам знадобиться — це каталог нашої адмінки. Створимо каталог admin і в ньому створимо 5 порожніх (поки що) файлів:

index.php (стартова сторінка адмінки);

menu.php (пункти меню);

new.php сторінка додавання пари питання-відповідь);

add.php обробник файлу new.php);

del.php (сторінка видалення пари питання-відповідь);

З опису кожної зі сторінок, думаю, зрозуміло для чого вони призначені. На стартовій сторінці адмінки можна помістити будь-описовий текст або ще що завгодно. На сторінці меню помістимо необхідні пункти меню:

  • Головна
  • Додавання запитання-відповіді
  • Видалення питання-відповіді

Файл меню ми будемо підключати під всі необхідні файли. Зробити це можна за допомогою функції require_once(). Поки що нам знадобиться для роботи файл new.php, в якому необхідно помістити форму для додавання пари питання-відповідь. Додамо 2 текстові області і кнопку відправлення даних:

Тут можна додати нову пару питання-відповідь

Введіть питання:
Введіть відповідь:

Тут нічого складного немає і все має бути зрозумілим. Першою текстової області ми дали ім’я question (в неї вводиться питання), другий — answer (в неї вводиться відповідь).

Форма створена — можна приступати до написання обробника для неї.

2. Пишемо обробник. Частина 1.

Обробником буде файл add.php — саме його ми вказали в атрибуті форми action. Перш, ніж ми приступимо до кодування, поговоримо трохи про те, чого ми хочемо, і про алгоритм роботи скрипта. Насамперед, ми повинні зробити так, щоб потрапити на сторінку-обробник можна було тільки з форми, тобто, натиснувши кнопку форми. Далі, нам необхідно, щоб були заповнені обидві текстові області форми. Якщо ж якийсь з полів форми не заповнене, то ми повинні інформувати про це користувача, вказуючи яке саме поле залишилося порожнім. Також, у разі помилки, вже заповнене поле повинно бути заповненим, щоб користувач не заповнював його двічі.

Так як ми не просто повинні перевіряти поля на порожнечу, але і ще показувати користувачу які саме поля він не заповнив, то треба трохи подумати, як нам реалізувати цю задачу.

Алгоритм буде простий.

Ми створимо порожню змінну, наприклад $error, і будемо перевіряти змінні, отримані з форми, на порожнечу. Якщо яка-небудь перемінна форми виявиться порожньою (це буде означати, що користувач не заповнив відповідне поле форми), то в змінну $error ми відразу ж запишемо повідомлення, що не заповнено таке-то поле. Якщо ще яке-небудь поле пусте, то в $error, використовуючи оператор конкатенації, допишемо відповідне повідомлення.

Після всіх перевірок ми просто перевіримо саму $error на порожнечу. Якщо вона порожня, відповідно, у неї не потрапило ніяких помилок, тобто користувач заповнив всі поля, і ми можемо працювати з отриманими даними. Якщо ж в $error щось є, то, відповідно, користувач не заповнив якийсь поля/поля і ми зареєструємо відповідну сесійний змінну зі значеннями $error і потім виведемо її на сторінці з формою.

Начебто алгоритм не надто складний — спробуємо його реалізувати. Першим пунктом програми є перевірка натискання кнопки форми. Зробити це можна, перевіривши наявність елемента submit (саме таке ім’я дали ми кнопці форми) в глобальному масиві POST, якщо такий елемент є кнопка була натиснута, інакше — робимо редирект на сторінку з формою. В принципі, про це вже неодноразово я згадував у ряді попередніх уроків. Пропишемо у файлі add.php:

if($_POST[‘submit’]){
}else header(«Location: new.php»);

Тепер, якщо спробувати потрапити на сторінку add.php з адресного рядка, то у нас нічого не вийде — ми будемо незмінно надаватися на сторінці форми. Але, якщо натиснути кнопку форми, то ми вільно поки що потрапляємо в обробник.

Тепер створимо 3 змінні:

if($_POST[‘submit’]){
$answer = trim($_POST[‘answer’]);
$question = trim($_POST[‘question’]);
$error = «;
}else header(«Location: new.php»);

Змінні $answer і $question приймають значення з глобального масиву POST, а $error, як ми і домовлялися, спочатку створюється з порожнім значенням. Зауважте, що змінним питання і відповіді присвоюються значення масиву POST, оброблені функцією trim(). Ця функція обрізає пробіли з початку і кінця рядка.

Для чого ми так зробили?

Вже говорилося, що нам потрібні заповненими обидві текстові області. Якщо якась з областей буде порожній — ми припинимо роботу програми. Але справа в тому, що пробіл — це не порожнеча, а такий же символ, як, скажімо, літера, тобто користувач цілком може ввести пробіл в полі і воно, відповідно, перестане бути пустим. Але пробіл без іншої інформації нам не підходить, тому ми обрізаємо пробіли на початку і в кінці отриманої рядка. Таким чином, якщо ми отримаємо один пробіл, то він буде вилучений і значення, отримане з поля, буде порожнім — про що ми й зможемо повідомити користувачеві.

Тепер перевіримо, порожні значення отриманих змінних — зробити це нам допоможе функція empty():

if($_POST[‘submit’]){
$answer = trim($_POST[‘answer’]);
$question = trim($_POST[‘question’]);
$error = «;
if(empty($question)) $error .= ‘

Полі питання обов’язково для заповнення!

‘;
if(empty($answer)) $error .= ‘

Поле відповіді обов’язково для заповнення!

‘;
}else header(«Location: new.php»);

Тут ми в умови перевіряємо, що якщо порожньо значення відповідної змінної, то ми Допишемо відповідне повідомлення в змінну $error. Тут нам потрібно саме дописувати щось в змінну, щоб не затерти її попереднє значення (воно може бути вже там, якщо ми перевіряємо на порожнечу другу область і при цьому перша також була порожня, про що ми і записали в $error). Дописати щось в змінну нам допоміг оператор конкатенації (склеювання рядків) — це точка перед знаком привласнення (знак рівності).

А тепер нам достатньо перевірити залишилося порожнім значення $error. Якщо це так — значить все ок, інакше — користувач щось не заповнив:

if($_POST[‘submit’]){
$answer = trim($_POST[‘answer’]);
$question = trim($_POST[‘question’]);
$error = «;
if(empty($question)) $error .= ‘

Полі питання обов’язково для заповнення!

‘;
if(empty($answer)) $error .= ‘

Поле відповіді обов’язково для заповнення!

‘;
if(empty($error)){
// заповнені обидва поля
}else{
}
}else header(«Location: new.php»);

3. Пишемо обробник. Частина 2.

Давайте продовжимо написання обробника з блоку інакше (else), тобто, коли користувач не вніс всю необхідну інформацію. Як ми і домовлялися, якщо це сталося, то ми повинні зробити редирект на сторінку з формою і повідомити користувачеві, що не все заповнено, а також залишити заповненим те поле, яке користувач вже заповнював. Тут ми скористаємося механізмом сесій — тому відкриємо на сторінці з формою і в оброблювачі сесію функцією session_start().

Також в створимо оброблювачі сесійний змінну $_SESSION[‘res’], в яку помістимо значення $error. Після створення сесійного змінної зробимо редирект і завершимо роботу програми:

session_start();
if($_POST[‘submit’]){
$answer = trim($_POST[‘answer’]);
$question = trim($_POST[‘question’]);
$error = «;
if(empty($question)) $error .= ‘

Полі питання обов’язково для заповнення!

‘;
if(empty($answer)) $error .= ‘

Поле відповіді обов’язково для заповнення!

‘;
if(empty($error)){
// заповнені обидва поля
}else{
$_SESSION[‘res’] = $error;
header(«Location: new.php»);
exit;
}
}else header(«Location: new.php»);

Тепер ми можемо вивести значення змінної $_SESSION[‘res’] в потрібному місці на сторінці форми. Також після виведення змінної разрегистрируем всі сесійні змінні (у нас ще буде декілька таких) і закриємо сесію. Робимо ми це для того, щоб всі повідомлення сесії виводилися тільки один раз — більше нам не потрібно:

Тут можна додати нову пару питання-відповідь

Введіть питання:
Введіть відповідь:

Тепер можна спробувати залишити якийсь з полів порожнім (або обидва поля) і відправити дані з форми… Ми знову опиняємося на сторінці форми, але при цьому бачимо повідомлення про те, що не заповнено відповідне поле. Але поле, яке було заповнене, не зберігає своє значення. Це незручно, оскільки доводиться заповнювати його двічі. Виправити цей недолік.

Зробити це просто.

Достатньо в оброблювачі зареєструвати ще 2 сесійні змінні і присвоїти їм значення відповідних змінних $answer і $question. Ну а у формі вивести ці змінні в якості значень текстових областей. Код файлу add.php:

session_start();
if($_POST[‘submit’]){
$answer = trim($_POST[‘answer’]);
$question = trim($_POST[‘question’]);
$error = «;
if(empty($question)) $error .= ‘

Полі питання обов’язково для заповнення!

‘;
if(empty($answer)) $error .= ‘

Поле відповіді обов’язково для заповнення!

‘;
if(empty($error)){
// заповнені обидва поля
}else{
$_SESSION[‘res’] = $error;
$_SESSION[‘question’] = $question;
$_SESSION[‘answer’] = $answer;
header(«Location: new.php»);
exit;
}
}else header(«Location: new.php»);

Код файлу new.php:

Тут можна додати нову пару питання-відповідь

Введіть питання:
Введіть відповідь:

А тепер можна переходити до додавання значень полів форми в файл base.txt.

4. Пишемо обробник. Частина 3.

Оскільки дані про кожній парі питання-відповідь у текстовому файлі ми зберігаємо порядково — нам необхідно перед записом об’єднати значення змінних $question і $answer в один рядок, не забувши при цьому додати роздільник. Також перед записом нового рядка ми повинні відкрити файл у відповідному режимі — в режимі запису, а точніше — в режимі Записування (режим «а»). Код тепер буде таким:

session_start();
if($_POST[‘submit’]){
$answer = trim($_POST[‘answer’]);
$question = trim($_POST[‘question’]);
$error = «;
if(empty($question)) $error .= ‘

Полі питання обов’язково для заповнення!

‘;
if(empty($answer)) $error .= ‘

Поле відповіді обов’язково для заповнення!

‘;
if(empty($error)){
// заповнені обидва поля
$handle = fopen(‘../base.txt’, ‘a’);
$string = $question. ‘//’ .$answer. «\r\n»;
}else{
$_SESSION[‘res’] = $error;
$_SESSION[‘question’] = $question;
$_SESSION[‘answer’] = $answer;
header(«Location: new.php»);
exit;
}
}else header(«Location: new.php»);

Зауважимо, що в кінці рядка ми також додали наступні символи «\r\n. Це символи переносу рядка.

Також необхідно внести невелику зміну в файл base.txt, а саме — після останнього рядка зробити перенесення рядка, тобто зробити так, щоб у файлі була ще одна порожня рядок — саме в неї і буде зроблено запис нового рядка, а згадані вище символи забезпечать перехід на новий рядок. Оскільки у нас в файлі з’явилася ще одна порожня рядок — це буде означати, що вона буде прочитана функція fgets() і виведена на сайт у вигляді порожніх блоків.

Так станеться тому, що в масиві, який читається файл, з’явиться додатковий порожній елемент.

Щоб виключити його висновок на сторінці сайту, досить трохи змінити код сторінки faq.php і в блоці foreach() додати перевірку. В умові перевірки ми будемо виводити на екран тільки ті елементи масиву, які не порожні. Новий код відповідного блоку сторінки faq.php буде таким:

foreach($read as $item){
if(!empty($item)){
$data[] = explode(‘//’, $item);
echo ‘

‘.$data[$i][0]. ‘

‘;
echo ‘

‘.$data[$i][1]. ‘

‘;
$i++;
}
}

Чудово!

Залишився останній крок — записати отриману рядок у файл:

Полі питання обов’язково для заповнення!

‘;
if(empty($answer)) $error .= ‘

Поле відповіді обов’язково для заповнення!

‘;
if(empty($error)){
// заповнені обидва поля
$handle = fopen(‘../base.txt’, ‘a’);
$string = $question. ‘//’ .$answer. «\r\n»;
if(fwrite($handle, $string)){
$_SESSION[‘res’] = ‘

Додано!

‘;
fclose($handle);
header(«Location: new.php»);
exit;
}else{
$_SESSION[‘res’] = ‘

Помилка запису! Спробуйте ще раз.

‘;
fclose($handle);
header(«Location: new.php»);
exit;
}
}else{
$_SESSION[‘res’] = $error;
$_SESSION[‘question’] = $question;
$_SESSION[‘answer’] = $answer;
header(«Location: new.php»);
exit;
}
}else header(«Location: new.php»);
?>

Як бачимо, нічого нового тут ми не зробили. Пишемо просту перевірку: якщо вдалося записати рядок у файл — у сесійний змінну заносимо повідомлення про успіх, закриваємо файл і робимо редирект на сторінку форми. Якщо не вийшло записати — записуємо в сесійний змінну відповідне повідомлення, закриваємо файл і робимо редирект на сторінку форми.

Відмінно!

Тепер можна додавати питання-відповідь через форму адміністративної частини. Залишився останній незначний момент. Якщо Ви працюєте на локальній машині, то все повинно працювати без проблем. Якщо ж Ви перенесете файли на сервер хостера, то отримаєте помилку при спробі додавання нової пари питання-відповідь. Ця помилка пов’язана з відсутністю прав на запис у файл. Для того щоб скрипт працював без проблем в мережі — просто встановіть потрібні для запису у файл права.

Докладніше про це Ви можете дізнатися у Вашого хостера. Виставити необхідні права на файл можна за допомогою файлового менеджера або через контрольну панель хостингу. На малюнках нижче Ви можете побачити, як виставити права, використовуючи FTP-менеджер FileZilla.

Натискаємо правою кнопкою миші по файлу і вибираємо пункт «Права доступу до файлу…».

FAQ з використанням PHP-jQuery і текстових файлів. Частина 2

Виставляємо права, зазначаючи необхідні чекбокси або ввівши числове значення потрібних прав доступу.

FAQ з використанням PHP-jQuery і текстових файлів. Частина 2

Висновок

На цьому урок закінчений.

Ми реалізували перший пункт нашої адміністративної частини і тепер можемо додавати питання і відповіді, використовуючи для цієї мети відповідний пункт адмінки.

У наступному (заключному) уроці ми напишемо другий пункт — видалення пари питання-відповідь.

Ваші запитання, відгуки чекаю в коментарях

З повагою Андрій Кудлай