Спешна регистрация php. Как се борих с кражбите... с помощта на php

Списъците със задачи са чудесен начин да следите ежедневните си задачи. В този урок ще съставим наш собствен списък със задачи, използвайки PHP, MySQL и AJAX. Този урок предполага, че имате основни познания по HTML, PHP, MySQL и JavaScript.

В този урок ще използваме следните файлове. Можете да ги изтеглите, като използвате връзката по-долу. Чувствайте се свободни да използвате алтернативна структура, но не забравяйте да промените пътищата на вашите файлове от тези в примерния код.

Първото нещо, което трябва да направим, е да очертаем структурата на нашата главна индексна страница ( index.php). Това приложение ще има само една страница и ще използваме AJAX за добавяне и изтриване на елементи от задачи. Отвори index.phpфайл и добавете следния код.

Прост списък със задачи

Забележка: В името на времето няма да разглеждаме стила в този урок. CSS файл е включен в изходните файлове.

Трябва да настроим MySQL база данни за съхраняване на нашите задачи. Най-лесният начин да направите това е чрез инструмент от страната на сървъра, наречен phpMyAdmin. Инструментите се доставят предварително инсталирани на повечето уеб хостове и са в комплект с локални услуги за разработка като WampServer и XAMPP. Ще настроим една таблица с името на „задачи“ и следните колони в този ред: „id“, „задача“, „дата“, „час“. Уверете се, че сте задали колоната с id на автоматично нарастване (трябва да има квадратче за отметка с надпис „A_I“).

След като създадем новата таблица, трябва да свържем нашия проект с базата данни. Отворете свържете.phpи добавете следния код към файла. Не забравяйте да замените данните за вашата база данни с полетата „username“, „password“ и „database_name“. Запазете файла, когато сте готови.

Обяснение на кодекса
PHP има функция mysql_connect(), която създава връзка към MySQL сървъра. Сървърната променлива трябва да остане настроена на „localhost“, освен ако вашата база данни не се хоства на различен сървър от файловете на проекта. В такъв случай заменете тази стойност за IP адреса на MySQL сървъра. След като връзката е направена, функцията mysql_select_db() избира конкретна база данни от сървъра.

Сега, когато създадохме нашите свържете.phpфайл, трябва да го добавим към основния индексен файл. Добавете следния код към index.phpи запазете промяната.

Прост списък със задачи

Следващото нещо, което искаме да направим, е да създадем начин за добавяне на елементи към нашия списък със задачи. За целта ще използваме формуляр и ще изпратим резултатите в базата данни. Добавете следния код към index.phpи запазете промяната.

Прост списък със задачи

Забележка: Забележете, че формулярът няма атрибути за действие и метод. Те обикновено се използват за изпращане на данни към друг файл чрез публикация или получаване на заявка. Ще използваме AJAX, за да изпратим нашия формуляр, така че няма да дефинираме нито един от тези атрибути. За повече информация относно AJAX вижте тази статия от W3Schools.

Отворете index.phpвъв вашия уеб браузър и погледнете. В този момент трябва да видите голям бял правоъгълник, където ще се показват елементите от задачи и текстово поле за добавяне на нови елементи към списъка.

Трябва да настроим начин формулярът да комуникира с базата данни. Използвайки jQuery, нека изпратим нашата нова задача чрез заявка за публикуване до add-task.phpфайл. Оттам нашият елемент ще бъде форматиран и записан в базата данни. Добавете следното към index.phpфайл непосредствено след затварящия таг.

Обяснение на кодекса
Скриптът по-горе прихваща стойността на текстовото поле при подаване на формуляр и го изпраща до add-task.phpизползвайки метода $.post() jQuery. The add-task.phpфайл след това изпраща обратно потвърждение за новодобавения елемент, така че да може да бъде добавен към списъка. Хубавото е, че всичко това се случва без опресняване на страницата!

Сега, когато нашият формуляр изпраща новия елемент от задачата до add-task.php, трябва да кажем на този файл какво да прави с информацията. Отворете add-task.phpи добавете следния код. Не забравяйте да запазите файла.