Vytváření, úpravy, aktualizace a mazání obsahu na webu je to, co dělá web dynamický. To je to, co budeme dělat v tomto příspěvku.
Uživatel, který navštíví naše stránky, bude moci vytvářet příspěvky, které se uloží do databáze mysql, načítat příspěvky z databáze a zobrazovat je na webové stránce. Každý příspěvek se zobrazí s tlačítkem upravit a smazat, aby uživatel mohl příspěvky aktualizovat a také je mazat.
Nejprve vytvořte databázi s názvem crud. V databázi crudu vytvořte tabulku s názvem informace. Informační tabulka by měla mít následující sloupce:
-
id - int(11)
- název - varchar(100)
- adresa - varchar(100)
Jo! Jen dvě pole. Snažím se to tady dělat jednoduše. takže přejdeme k dalšímu kroku.
Vytvořte soubor s názvem index.php a vložte do něj následující kód:
<!DOCTYPE html>
<html>
<head>
<title>CRUD: CReate, Update, Delete PHP MySQL</title>
</head>
<body>
<form method="post" action="server.php" >
<div class="input-group">
<label>Name</label>
<input type="text" name="name" value="">
</div>
<div class="input-group">
<label>Address</label>
<input type="text" name="address" value="">
</div>
<div class="input-group">
<button class="btn" type="submit" name="save" >Save</button>
</div>
</form>
</body>
</html>
Pokud stránku uložíte a otevřete ve svém prohlížeči, získáte něco takového:
Nevypadá to jako nejlepší forma na světě, že? Pojďme to napravit. Přidejte tento řádek přímo pod značku
v sekci head vašeho souboru index.php:</P> <pre><code><link rel="stylesheet" type="text/css" href="style.css"></code></pre> <p>
To je odkaz pro načtení stylů ze souboru šablony stylů. Vytvoříme soubor styles.css a přidáme do něj tento stylingový kód.</P> <pre><code>body {
font-size: 19px;
}
table{
width: 50%;
margin: 30px auto;
border-collapse: collapse;
text-align: left;
}
tr {
border-bottom: 1px solid #cbcbcb;
}
th, td{
border: none;
height: 30px;
padding: 2px;
}
tr:hover {
background: #F5F5F5;
}
form {
width: 45%;
margin: 50px auto;
text-align: left;
padding: 20px;
border: 1px solid #bbbbbb;
border-radius: 5px;
}
.input-group {
margin: 10px 0px 10px 0px;
}
.input-group label {
display: block;
text-align: left;
margin: 3px;
}
.input-group input {
height: 30px;
width: 93%;
padding: 5px 10px;
font-size: 16px;
border-radius: 5px;
border: 1px solid gray;
}
.btn {
padding: 10px;
font-size: 15px;
color: white;
background: #5F9EA0;
border: none;
border-radius: 5px;
}
.edit_btn {
text-decoration: none;
padding: 2px 5px;
background: #2E8B57;
color: white;
border-radius: 3px;
}
.del_btn {
text-decoration: none;
padding: 2px 5px;
color: white;
border-radius: 3px;
background: #800000;
}
.msg {
margin: 30px auto;
padding: 10px;
border-radius: 5px;
color: #3c763d;
background: #dff0d8;
border: 1px solid #3c763d;
width: 50%;
text-align: center;
}</code></pre> <p>
Nyní se znovu podíváme na náš formulář v prohlížeči:</P> <p>
<img src="http://www.sqldat.com/article/uploadfiles/202205/2022051317463381.png" /></P> <p>
To je lepší! </P> <p>
Obvykle rád oddělím svůj HTML kód od PHP kódu co nejvíce. Považuji to za dobrou praxi. Vytvořme další soubor s názvem php_code.php, kde implementujeme všechny funkce php, jako je připojení k databázi, dotazování na databázi a podobně.</P> <p>
Otevřete tedy php_code.php a vložte do něj následující kód:</P> <pre><code><?php
session_start();
$db = mysqli_connect('localhost', 'root', '', 'crud');
// initialize variables
$name = "";
$address = "";
$id = 0;
$update = false;
if (isset($_POST['save'])) {
$name = $_POST['name'];
$address = $_POST['address'];
mysqli_query($db, "INSERT INTO info (name, address) VALUES ('$name', '$address')");
$_SESSION['message'] = "Address saved";
header('location: index.php');
}
// ...</code></pre> <p>
Nyní vložte tento soubor na začátek (úplně první řádek) vašeho souboru index.php. Asi takhle:</P> <pre><code><?php include('server.php'); ?></code></pre> <p>
V tuto chvíli se tento kód pouze připojí k databázi, inicializuje některé proměnné a uloží odeslaná data z formuláře do databáze v informacích, které jsme vytvořili dříve. To je pouze CReate část CRUD. Pokračujme s ostatními.</P> <p>
Nyní znovu navštivte svůj soubor index.php a přidejte tento kód přímo pod značku <body>:</P> <pre><code>// ...
<body>
<?php if (isset($_SESSION['message'])): ?>
<div class="msg">
<?php
echo $_SESSION['message'];
unset($_SESSION['message']);
?>
</div>
<?php endif ?></code></pre> <p>
Tento kód zobrazí potvrzovací zprávu, která uživateli sdělí, že byl v databázi vytvořen nový záznam. </P> <p>
Chcete-li získat databázové záznamy a zobrazit je na stránce, přidejte tento kód bezprostředně nad vstupní formulář:</P> <pre><code><?php $results = mysqli_query($db, "SELECT * FROM info"); ?>
<table>
<thead>
<tr>
<th>Name</th>
<th>Address</th>
<th colspan="2">Action</th>
</tr>
</thead>
<?php while ($row = mysqli_fetch_array($results)) { ?>
<tr>
<td><?php echo $row['name']; ?></td>
<td><?php echo $row['address']; ?></td>
<td>
<a href="index.php?edit=<?php echo $row['id']; ?>" class="edit_btn" >Edit</a>
</td>
<td>
<a href="server.php?del=<?php echo $row['id']; ?>" class="del_btn">Delete</a>
</td>
</tr>
<?php } ?>
</table>
<form>
// ...</code></pre> <p>
Pojďme vytvořit nový záznam a uvidíme, jestli to funguje:</P> <p>
<img src="http://www.sqldat.com/article/uploadfiles/202205/2022051317463338.png" /></P> <p>
..a voila!! Funguje to perfektně!</P> <p>
Nyní přejdeme k úpravám. Na začátek svého souboru index.php (bezprostředně za příkaz include) přidejte následující kód:</P> <pre><code><?php
if (isset($_GET['edit'])) {
$id = $_GET['edit'];
$update = true;
$record = mysqli_query($db, "SELECT * FROM info WHERE id=$id");
if (count($record) == 1 ) {
$n = mysqli_fetch_array($record);
$name = $n['name'];
$address = $n['address'];
}
}
?></code></pre> <p>
Při editaci databázového záznamu musíme do formuláře vložit staré hodnoty, aby je bylo možné upravit. Chcete-li to provést, upravte naše vstupní pole ve formuláři a nastavte hodnoty převzaté z databáze ($name, $address) jako hodnoty na <strong>value</strong> atribut polí formuláře.</P> <p>
Přidejte také skryté pole pro ID záznamu, který budeme aktualizovat, aby jej bylo možné v databázi jednoznačně rozpoznat podle jeho ID. Toto to vysvětluje lépe:</P> <pre><code>// newly added field
<input type="hidden" name="id" value="<?php echo $id; ?>">
// modified form fields
<input type="text" name="name" value="<?php echo $name; ?>">
<input type="text" name="address" value="<?php echo $address; ?>"></code></pre> <p>
Pamatujte, že vše je ve vstupním <form>.</P> <p>
Nyní, když klikneme na tlačítko upravit u konkrétního záznamu z databáze, hodnoty se vyplní do formuláře a budeme je moci upravovat. Protože upravujeme na stejném formuláři jako při vytváření, musíme zadat podmínku, která určí příslušné tlačítko, které se má zobrazit. Například při editaci zobrazíme na formuláři tlačítko aktualizace a při vytváření zobrazíme tlačítko uložit. Děláme to pomocí <strong>aktualizace </strong> proměnná, která je booleovská. Když je aktualizace true, zobrazí se tlačítko aktualizace a pokud je hodnota false, zobrazí se tlačítko uložit.</P> <p>
Nahraďte tlačítko pro uložení ve formuláři takto:</P> <p>
Nahradit ..</P> <pre><code><button class="btn" type="submit" name="save" >Save</button></code></pre> <p>
s...</P> <pre><code><?php if ($update == true): ?>
<button class="btn" type="submit" name="update" style="background: #556B2F;" >update</button>
<?php else: ?>
<button class="btn" type="submit" name="save" >Save</button>
<?php endif ?></code></pre> <p>
Nyní, když to spustíme v prohlížeči a klikneme na tlačítko Upravit, dostaneme toto:</P> <p>
<img src="http://www.sqldat.com/article/uploadfiles/202205/2022051317463388.png" /></P> <p>
Nyní můžete vidět, že je zobrazeno tlačítko aktualizace. Přidejme kód, který se spustí po kliknutí na toto tlačítko.</P> <p>
Otevřete soubor php_code.php a přidejte tento kód do tlačítka:</P> <pre><code>// ...
if (isset($_POST['update'])) {
$id = $_POST['id'];
$name = $_POST['name'];
$address = $_POST['address'];
mysqli_query($db, "UPDATE info SET name='$name', address='$address' WHERE id=$id");
$_SESSION['message'] = "Address updated!";
header('location: index.php');
}</code></pre> <p>
Nyní změňte hodnoty ve formuláři a klikněte na tlačítko aktualizovat. </P> <p>
<img src="http://www.sqldat.com/article/uploadfiles/202205/2022051317463390.png" /></P> <p>
Skvělé!</P> <p>
Poslední věc:mazání záznamů. Stačí přidat tento kód na konec souboru php_code.php a můžete začít:</P> <pre><code>if (isset($_GET['del'])) {
$id = $_GET['del'];
mysqli_query($db, "DELETE FROM info WHERE id=$id");
$_SESSION['message'] = "Address deleted!";
header('location: index.php');
}</code></pre> <p>
Pokud kliknete na tlačítko smazat, smaže se záznam z databáze a zobrazí se zpráva stejně jako ostatní akce.</P> <p>
</P> <h3> </h3> <h2>Závěr</h2> <p>
Tím se dostáváme na konec tohoto tutoriálu. Doufám, že to bylo užitečné a stálo to za váš čas. Jsem velmi poctěn vaší trpělivostí, že jste to dodrželi až do konce. Pokud se vám tento návod líbí, sdílejte jej se svými přáteli kliknutím na některou z níže uvedených ikon sociálních sítí. Nezapomeňte se podívat na mé další návody na tomto webu. </P> <p>
Díky</P> <br>
</section>
</article>
<div class="ad5">
<script language='javascript' src='http://www.sqldat.com/css/ad/6.js'></script>
</div>
<div id="turn-page2" class="id_cstextovertr">
<a class='LinkPrevArticle' href='http://cs.sqldat.com/rps/lil/1009019451.html' >Kompletní systém registrace uživatelů pomocí PHP a databáze MySQL </a>
<a class='LinkNextArticle' href='http://cs.sqldat.com/rps/lil/1009019453.html' >Jak nahrávat a stahovat soubory PHP a MySQL </a>
</div>
<section class="cspage_bot2">
<ol class="csarticle_list">
<li class="csflexstart">
<i></i>
<a href="https://cs.sqldat.com/rps/lil/1009003818.html">
<p class="cstextovertr" title="Mysql vybrat odlišné ">Mysql vybrat odlišné </p>
</a>
</li>
<li class="csflexstart">
<i></i>
<a href="https://cs.sqldat.com/rps/oml/1009008275.html">
<p class="cstextovertr" title="uživatel postgres spustí proces, který zabere 100% využití všech CPU ">uživatel postgres spustí proces, který zabere 100% využití všech CPU </p>
</a>
</li>
<li class="csflexstart">
<i></i>
<a href="https://cs.sqldat.com/rps/oml/1009009210.html">
<p class="cstextovertr" title="Jak udělit všechna oprávnění k pohledům libovolnému uživateli ">Jak udělit všechna oprávnění k pohledům libovolnému uživateli </p>
</a>
</li>
<li class="csflexstart">
<i></i>
<a href="https://cs.sqldat.com/rps/lil/1009019463.html">
<p class="cstextovertr" title="Správa uživatelských účtů, role, oprávnění, autentizace PHP a MySQL - 4. část ">Správa uživatelských účtů, role, oprávnění, autentizace PHP a MySQL - 4. část </p>
</a>
</li>
</ol>
</section>
</section>
</section>
<footer>
<section class="container_cshe flexbetcseo csfooter_info cs_flexalign">
<a href="https://cs.sqldat.com" class="csbottom_logo">
<img src="http://www.sqldat.com/css/img/logo.svg" alt="">
</a>
<span class="csflexstart">
© AUTORSKÁ PRÁVA
<a href="https://cs.sqldat.com">http://cs.sqldat.com</a>
VŠECHNA PRÁVA VYHRAZENA
</span>
</section>
</footer>
<script language='javascript' src='http://www.sqldat.com/css/ad/c.js'></script>
</body>
</html>