Naléhavý výpis php. Jak jsem bojoval s krádeží... pomocí php

Seznamy úkolů jsou skvělý způsob, jak sledovat své každodenní úkoly. V tomto tutoriálu si vytvoříme vlastní seznam úkolů pomocí PHP, MySQL a AJAX. Tento tutoriál předpokládá, že máte základní znalosti HTML, PHP, MySQL a JavaScript.

V tomto tutoriálu budeme používat následující soubory. Můžete si je stáhnout pomocí odkazu níže. Nebojte se použít alternativní strukturu, ale nezapomeňte změnit cesty k souborům z těch v ukázkovém kódu.

Hlavní indexový soubor

První věc, kterou musíme udělat, je rozvržení struktury pro naši hlavní indexovou stránku ( index.php). Tato aplikace bude mít pouze jednu stránku a budeme používat AJAX k přidávání a odstraňování úkolů. Otevři index.php soubor a přidejte následující kód.

Jednoduchý seznam úkolů

Poznámka: Z časových důvodů se v tomto tutoriálu nebudeme zabývat styly. Soubor CSS byl zahrnut do zdrojových souborů.

Připojení k databázi MySQL

Potřebujeme nastavit databázi MySQL pro ukládání našich úkolů. Nejjednodušší způsob, jak toho dosáhnout, je pomocí nástroje na straně serveru s názvem phpMyAdmin . Nástroje jsou předinstalované na většině webových hostitelů a jsou dodávány se službami místního vývoje, jako jsou WampServer a XAMPP. Vytvoříme jednu tabulku s názvem ‚úkoly‘ a následujícími sloupci v tomto pořadí: ‚id‘, ‚úkol‘, ‚datum‘, ‚čas‘. Nezapomeňte nastavit sloupec id na automatické zvýšení (mělo by tam být zaškrtávací políčko označené „A_I“).

Po vytvoření nové tabulky potřebujeme připojit náš projekt k databázi. OTEVŘENO connect.php a přidejte do souboru následující kód. Ujistěte se, že jste nahradili údaje o své databázi za pole ‚username‘, ‚password‘ a ‚database_name‘. Až budete hotovi, uložte soubor.

Vysvětlení kodexu
PHP má funkci mysql_connect(), která vytváří připojení k serveru MySQL. Proměnná serveru by měla zůstat nastavena na „localhost“, pokud vaše databáze není hostována na jiném serveru než soubory projektu. V takovém případě nahraďte tuto hodnotu IP adresou serveru MySQL. Po navázání spojení vybere funkce mysql_select_db() konkrétní databázi ze serveru.

Nyní, když jsme vytvořili naše connect.php soubor, musíme jej přidat do hlavního indexového souboru. Přidejte následující kód do index.php a uložte změnu.

Jednoduchý seznam úkolů

Přidání nového úkolu

Další věc, kterou chceme udělat, je vytvořit způsob, jak přidat položky do našeho seznamu úkolů. K tomu použijeme formulář a výsledky odešleme do databáze. Přidejte následující kód do index.php a uložte změnu.

Jednoduchý seznam úkolů

Poznámka: Všimněte si, že formulář nemá atributy akce a metody. Ty se obvykle používají k odeslání dat do jiného souboru prostřednictvím příspěvku nebo získání požadavku. K odeslání formuláře budeme používat AJAX, takže nebudeme definovat žádný z těchto atributů. Další informace o AJAX najdete v tomto článku od W3Schools.

OTEVŘENO index.php ve svém webovém prohlížeči a podívejte se. V tomto okamžiku byste měli vidět velký bílý obdélník, kde budou zobrazeny úkoly, a textové pole pro přidání nových položek do seznamu.

Musíme nastavit způsob komunikace formuláře s databází. Pomocí jQuery odešleme naši novou položku úkolu prostřednictvím žádosti o příspěvek na adresu add-task.php soubor. Odtud bude naše položka naformátována a uložena do databáze. Přidejte následující do index.php soubor přímo za uzavírací značkou.

Vysvětlení kodexu
Výše uvedený skript zachytí hodnotu textového pole při odeslání formuláře a odešle ji na add-task.php pomocí metody $.post() jQuery. The add-task.php soubor pak odešle zpět potvrzení o nově přidané položce, takže ji lze přidat do seznamu. Krásné na tom je, že se to všechno děje bez obnovování stránky!

Nyní, když náš formulář odesílá novou položku úkolu na add-task.php, musíme tomu souboru sdělit, co má s informacemi dělat. OTEVŘENO add-task.php a přidejte následující kód. Nezapomeňte soubor uložit.



Související články: