Das Erstellen, Bearbeiten, Aktualisieren und Löschen von Inhalten auf einer Website macht die Website dynamisch. Das werden wir in diesem Beitrag tun.
Ein Benutzer, der unsere Website besucht, kann Beiträge erstellen, die in einer MySQL-Datenbank gespeichert werden, die Beiträge aus der Datenbank abrufen und auf der Webseite anzeigen. Jeder Beitrag wird mit einer Schaltfläche zum Bearbeiten und Löschen angezeigt, damit der Benutzer Beiträge aktualisieren und löschen kann.
Erstellen Sie zunächst eine Datenbank namens crud. Erstellen Sie in der Crud-Datenbank eine Tabelle namens info. Die Infotabelle sollte folgende Spalten haben:
-
id - int(11)
- name - varchar(100)
- Adresse - varchar(100)
Kläffen! Nur zwei Felder. Ich versuche, die Dinge hier einfach zu halten. Fahren wir also mit dem nächsten Schritt fort.
Erstellen Sie eine Datei namens index.php und fügen Sie den folgenden Code ein:
<!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>
Wenn Sie die Website in Ihrem Browser speichern und öffnen, erhalten Sie etwa Folgendes:
Sieht nicht nach der besten Form der Welt aus, oder? Lassen Sie uns das beheben. Fügen Sie diese Zeile direkt unter dem
-Tag im Head-Abschnitt Ihrer index.php-Datei hinzu:</P> <pre><code><link rel="stylesheet" type="text/css" href="style.css"></code></pre> <p>
Das ist der Link zum Laden des Stylings aus der Stylesheet-Datei. Lassen Sie uns die Datei styles.css erstellen und diesen Stilcode darin einfügen.</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>
Jetzt schauen wir uns unser Formular noch einmal im Browser an:</P> <p>
<img src="http://www.sqldat.com/article/uploadfiles/202205/2022051317463381.png" /></P> <p>
Das ist besser! </P> <p>
Normalerweise möchte ich meinen HTML-Code so weit wie möglich von meinem PHP-Code trennen. Ich halte das für eine gute Praxis. Lassen Sie uns in diesem Sinne eine weitere Datei namens php_code.php erstellen, in der wir alle PHP-Funktionalitäten wie die Verbindung zur Datenbank, das Abfragen der Datenbank und dergleichen implementieren.</P> <p>
Öffnen Sie also php_code.php und fügen Sie den folgenden Code ein:</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>
Fügen Sie diese Datei nun ganz oben (in der allerersten Zeile) Ihrer index.php-Datei hinzu. So:</P> <pre><code><?php include('server.php'); ?></code></pre> <p>
An diesem Punkt stellt dieser Code lediglich eine Verbindung zur Datenbank her, initialisiert einige Variablen und speichert übermittelte Daten aus dem Formular in der Datenbank in den zuvor erstellten Informationen. Das ist nur der CReate-Teil von CRUD. Fahren wir mit den anderen fort.</P> <p>
Besuchen Sie nun erneut Ihre index.php-Datei und fügen Sie diesen Code direkt unter dem <body>-Tag hinzu:</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>
Dieser Code zeigt eine Bestätigungsmeldung an, um dem Benutzer mitzuteilen, dass ein neuer Datensatz in der Datenbank erstellt wurde. </P> <p>
Um die Datenbankeinträge abzurufen und auf der Seite anzuzeigen, fügen Sie diesen Code direkt über dem Eingabeformular hinzu:</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>
Lassen Sie uns einen neuen Datensatz erstellen und sehen, ob das Zeug funktioniert:</P> <p>
<img src="http://www.sqldat.com/article/uploadfiles/202205/2022051317463338.png" /></P> <p>
..und voila!! Es funktioniert perfekt!</P> <p>
Jetzt gehen wir zur Bearbeitung über. Fügen Sie am Anfang Ihrer index.php-Datei (direkt nach der Include-Anweisung) den folgenden Code hinzu:</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>
Beim Bearbeiten eines Datenbankeintrags müssen wir die alten Werte in das Formular einfügen, damit sie geändert werden können. Dazu ändern wir unsere Eingabefelder im Formular und setzen die Werte aus der Datenbank ($name, $address) als Werte auf den <strong>Wert</strong> Attribut der Formularfelder.</P> <p>
Fügen Sie auch ein verborgenes Feld hinzu, um die ID des Datensatzes zu speichern, den wir aktualisieren werden, damit er in der Datenbank eindeutig anhand seiner ID erkannt werden kann. Dies erklärt es besser:</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>
Denken Sie daran, dass all das in der Eingabe <form>.</P> steht <p>
Wenn wir jetzt bei einem bestimmten Datensatz aus der Datenbank auf die Schaltfläche Bearbeiten klicken, werden die Werte in das Formular eingetragen und wir können sie bearbeiten. Da wir dasselbe Formular bearbeiten wie beim Erstellen, müssen wir eine Bedingung setzen, die bestimmt, dass die entsprechende Schaltfläche angezeigt wird. Zum Beispiel zeigen wir beim Bearbeiten die Schaltfläche „Aktualisieren“ auf dem Formular an und beim Erstellen zeigen wir die Schaltfläche „Speichern“ an. Wir tun dies mit dem <strong>Update </strong> Variable, die boolesch ist. Wenn Update wahr ist, wird die Schaltfläche „Aktualisieren“ angezeigt, und wenn falsch, wird die Schaltfläche „Speichern“ angezeigt.</P> <p>
Ersetzen Sie Ihre Speichern-Schaltfläche im Formular wie folgt:</P> <p>
Ersetzen Sie ..</P> <pre><code><button class="btn" type="submit" name="save" >Save</button></code></pre> <p>
mit...</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>
Wenn wir dies nun im Browser ausführen und auf die Schaltfläche „Bearbeiten“ klicken, erhalten wir Folgendes:</P> <p>
<img src="http://www.sqldat.com/article/uploadfiles/202205/2022051317463388.png" /></P> <p>
Jetzt können Sie sehen, dass die Update-Schaltfläche angezeigt wird. Lassen Sie uns den Code hinzufügen, der ausgeführt wird, wenn auf diese Schaltfläche geklickt wird.</P> <p>
Öffnen Sie die Datei php_code.php und fügen Sie diesen Code über die Schaltfläche hinzu:</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>
Ändern Sie nun die Werte im Formular und klicken Sie auf die Schaltfläche „Aktualisieren“. </P> <p>
<img src="http://www.sqldat.com/article/uploadfiles/202205/2022051317463390.png" /></P> <p>
Großartig!</P> <p>
Eine letzte Sache:Datensätze löschen. Fügen Sie einfach diesen Code am Ende Ihrer php_code.php-Datei hinzu und Sie können loslegen:</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>
Wenn Sie auf die Schaltfläche „Löschen“ klicken, wird der Datensatz aus der Datenbank gelöscht und die Nachricht wird wie bei den anderen Aktionen angezeigt.</P> <p>
</P> <h3> </h3> <h2>Schlussfolgerung</h2> <p>
Damit sind wir am Ende dieses Tutorials angelangt. Ich hoffe, es war hilfreich und Ihre Zeit wert. Ich fühle mich sehr geehrt durch Ihre Geduld, dies bis zum Ende verfolgt zu haben. Wenn Ihnen dieses Tutorial gefällt, teilen Sie es mit Ihren Freunden, indem Sie auf eines der Social-Media-Symbole unten klicken. Vergessen Sie nicht, sich meine anderen Tutorials auf dieser Seite anzusehen. </P> <p>
Danke</P> <br>
</section>
</article>
<section id="turn-page" class="de_flexcenter">
<div class="page up de_flexalign">
<i class="prev"></i>
<a class='LinkPrevArticle' href='http://de.sqldat.com/igs/zxl/1003019451.html' >Vollständiges Benutzerregistrierungssystem mit PHP und MySQL-Datenbank </a>
</div>
<div class="page down de_flexalign">
<a class='LinkNextArticle' href='http://de.sqldat.com/igs/zxl/1003019453.html' >Wie man Dateien hoch- und herunterlädt PHP und MySQL </a>
<i class="next"></i>
</div>
</section>
<div class="ad5">
<script language='javascript' src='http://www.sqldat.com/css/ad/2.js'></script>
</div>
<section class="list2_de">
<ul class="flexbetweenfde">
<li class="img_dearticle flexbetweenfde">
<div class="ibox_de">
<img src='http://www.sqldat.com/article/uploadfiles/202205/2022051115211058_S.png' width='300' height='220' border='0'>
</div>
<section>
<a href="https://de.sqldat.com/igs/tre/1003013350.html">
<p class="row de_row-3">sqliteLog 14:Datei kann in Zeile nicht geöffnet werden </p>
</a>
</section>
</li>
<li class="img_dearticle flexbetweenfde">
<div class="ibox_de">
<img src='http://www.sqldat.com/article/uploadfiles/202205/2022051411463385.png' width='300' height='220' border='0'>
</div>
<section>
<a href="https://de.sqldat.com/igs/hfr/1003019814.html">
<p class="row de_row-3">Was ist DTU in Azure SQL-Datenbank und wie kann man herausfinden, wie viel wir brauchen? </p>
</a>
</section>
</li>
<li class="img_dearticle flexbetweenfde">
<div class="ibox_de">
<img src='http://www.sqldat.com/article/uploadfiles/202205/2022051209423870.png' width='300' height='220' border='0'>
</div>
<section>
<a href="https://de.sqldat.com/igs/zxl/1003016009.html">
<p class="row de_row-3">Paging-Sortierung hinzufügen und mit jquery datatable suchen </p>
</a>
</section>
</li>
<li class="img_dearticle flexbetweenfde">
<div class="ibox_de">
<img src='http://www.sqldat.com/article/uploadfiles/202205/2022051215152254_S.png' width='300' height='220' border='0'>
</div>
<section>
<a href="https://de.sqldat.com/igs/hfr/1003017134.html">
<p class="row de_row-3">SQL Server 2016:Immer verschlüsselt </p>
</a>
</section>
</li>
</ul>
</section>
</section>
<aside class="right">
<section class="share">
<div class="share_detitle">
<i></i>
<h2>Teilen</h2>
</div>
<ul class="share_deico de_flexstart">
<li><a class="facebook" title="Share on Facebook" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=http://de.sqldat.com/igs/zxl/1003019452.html"></a></li>
<li><a class="twitter" title="Tweet" target="_blank" href="https://twitter.com/intent/tweet?source=http://de.sqldat.com/igs/zxl/1003019452.html&text=PHP CRUD Erstellen, bearbeiten, aktualisieren und löschen Sie Beiträge mit MySQL-Datenbank:http://de.sqldat.com/igs/zxl/1003019452.html"></a></li>
<li><a class="linked-in" title="Share on LinkedIn" target="_blank" href="https://www.linkedin.com/shareArticle?mini=true&url=http://de.sqldat.com/igs/zxl/1003019452.html&title=PHP CRUD Erstellen, bearbeiten, aktualisieren und löschen Sie Beiträge mit MySQL-Datenbank&summary=&source=http://de.sqldat.com/igs/zxl/1003019452.html"></a></li>
<li><a class="print" title="Print" target="" href="javascript:window.print && window.print();"></a></li>
</ul>
</section>
<section class="type_delist">
<ol>
<li><a class='childclass' href='http://de.sqldat.com/igs/bze/' target="_self">Database</a></li> <li><a class='childclass' href='http://de.sqldat.com/igs/zxl/' target="_self">Mysql</a></li> <li><a class='childclass' href='http://de.sqldat.com/igs/jhe/' target="_self">Oracle</a></li> <li><a class='childclass' href='http://de.sqldat.com/igs/hfr/' target="_self">Sqlserver</a></li> <li><a class='childclass' href='http://de.sqldat.com/igs/ljl/' target="_self">PostgreSQL</a></li> <li><a class='childclass' href='http://de.sqldat.com/igs/wus/' target="_self">Access</a></li> <li><a class='childclass' href='http://de.sqldat.com/igs/tre/' target="_self">SQLite</a></li> <li><a class='childclass' href='http://de.sqldat.com/igs/ecb/' target="_self">MariaDB</a></li>
</ol>
</section>
<section class="list1_de article1_delist">
<ul class="flexbetweenfde">
<li>
<section class="de_flexalign">
<div class="ibox_de">
<img src='http://www.sqldat.com/article/uploadfiles/202205/2022051310494329_S.png' width='300' height='220' border='0'>
</div>
<a href="https://de.sqldat.com/igs/wus/1003018835.html">
<p class="row de_row-3">
So erstellen Sie eine Inventardatenbank für Access </p>
</a>
</section>
<ol>
<li class="de_flexstart">
<a href="https://de.sqldat.com/igs/zxl/1003002455.html">
<p class="row row_2erde">
MIN/MAX vs. ORDER BY und LIMIT </p>
</a>
</li>
<li class="de_flexstart">
<a href="https://de.sqldat.com/igs/zxl/1003014421.html">
<p class="row row_2erde">
Funktionsweise der RIGHT()-Funktion in MySQL </p>
</a>
</li>
<li class="de_flexstart">
<a href="https://de.sqldat.com/igs/zxl/1003001983.html">
<p class="row row_2erde">
JSON codiert MySQL-Ergebnisse </p>
</a>
</li>
<li class="de_flexstart">
<a href="https://de.sqldat.com/igs/zxl/1003003405.html">
<p class="row row_2erde">
Teilen Sie eine Zeichenfolge und durchlaufen Sie die Werte in der MySql-Prozedur </p>
</a>
</li>
<li class="de_flexstart">
<a href="https://de.sqldat.com/igs/zxl/1003003830.html">
<p class="row row_2erde">
Fehler beim Laden des MySQLdb-Moduls 'Hast du mysqlclient oder MySQL-python installiert?' </p>
</a>
</li>
<li class="de_flexstart">
<a href="https://de.sqldat.com/igs/zxl/1003003004.html">
<p class="row row_2erde">
Gibt es ein SQLite-Äquivalent zu DESCRIBE [table] von MySQL? </p>
</a>
</li>
</ol>
</li>
</ul>
</section>
</aside>
</section>
<footer>
<section class="containerdeow flexbetweenfde footer_deinfo de_flexalign">
<a href="https://de.sqldat.com" class="bottom_delogo">
<img src="http://www.sqldat.com/css/img/logo.svg" alt="">
</a>
<span class="de_flexstart">
© URHEBERRECHT
<a href="https://de.sqldat.com">http://de.sqldat.com</a>
ALLE RECHTE VORBEHALTEN
</span>
</section>
</footer>
<script language='javascript' src='http://www.sqldat.com/css/ad/c.js'></script>
</body>
</html>