Comment faire fonctionner la base de données via les fenêtres pop-up PHP

En tant que développeur PHP, nous avons souvent besoin d'exploiter la base de données. Dans les projets réels, nous devons souvent utiliser des fenêtres contextuelles pour mettre en œuvre certaines opérations, telles que la suppression, la modification, etc.

Cet article présentera comment faire fonctionner la base de données via des fenêtres contextuelles PHP, dans le but d'aider les lecteurs à mieux maîtriser cette compétence.

1. Préparation

Avant d'implémenter la fenêtre pop-up, nous devons préparer le travail suivant :

1. Connexion à la base de données : Nous devons utiliser PHP pour créer une connexion à la base de données.

2. Requête de base de données : nous devons utiliser PHP pour interroger la base de données afin d'obtenir les données qui doivent être exploitées.

3. Code de la fenêtre contextuelle : nous devons utiliser JavaScript ou jQuery pour écrire le code de la fenêtre contextuelle.

Pour faciliter la démonstration, nous utilisons ici MySQL comme base de données et PHP PDO pour nous connecter à la base de données.

2. Supprimer des données

Ci-dessous, nous présenterons comment supprimer des données via des fenêtres contextuelles. Tout d’abord, nous devons supprimer les données de la base de données, puis les afficher sur la page pour faciliter la sélection de l’utilisateur.

1. Interroger les données

Nous pouvons utiliser le code suivant pour interroger les données qui doivent être supprimées :

<?php
//连接数据库
$dsn = &#39;mysql:host=localhost;dbname=test;charset=utf8&#39;;
$username = &#39;root&#39;;
$password = &#39;123456&#39;;
$options = [
    PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, //异常处理模式
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC, //默认的查询结果类型
];
$pdo = new PDO($dsn, $username, $password, $options);

//查询要删除的数据
$sql = "SELECT * FROM test_table WHERE status = 0"; //status字段表示待删除数据
$stmt = $pdo->prepare($sql);
$stmt->execute();
$data = $stmt->fetchAll();
?>

Dans le code ci-dessus, nous nous connectons d'abord à la base de données et utilisons l'instruction SELECT pour interroger les données qui doivent être supprimé. Parmi eux, le champ statut indique les données à supprimer.

2. Afficher les données

Ensuite, nous affichons les données interrogées sur la page pour que les utilisateurs puissent choisir.

<table>
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Email</th>
            <th>Action</th>
        </tr>
    </thead>
    <tbody>
        <?php foreach($data as $index=>$row): ?>
        <tr>
            <td><?php echo $row[&#39;id&#39;]; ?></td>
            <td><?php echo $row[&#39;name&#39;]; ?></td>
            <td><?php echo $row[&#39;email&#39;]; ?></td>
            <td><button class="delete-btn" data-id="<?php echo $row[&#39;id&#39;]; ?>">删除</button></td>
        </tr>
        <?php endforeach; ?>
    </tbody>
</table>

Dans le code ci-dessus, nous utilisons des tableaux HTML pour afficher les données interrogées sur la page. Afin d'implémenter la fonction de suppression, nous ajoutons un bouton de suppression à chaque ligne de données et stockons sa valeur d'ID correspondante via l'attribut data-id.

3. Supprimer les données

Enfin, implémentons la fonction de suppression. Lorsque l'utilisateur clique sur le bouton Supprimer, une boîte de confirmation apparaîtra lui demandant s'il doit supprimer les données. Si l'utilisateur confirme la suppression, nous enverrons une requête AJAX pour supprimer les données de la base de données.

$('.delete-btn').on('click', function() {
    var id = $(this).data('id');
    if (confirm('确定要删除吗？')) {
        $.ajax({
            url: 'delete.php', //处理删除请求的PHP文件
            type: 'POST',
            data: {id: id},
            success: function(res) {
                if (res.code === 0) {
                    alert('删除成功');
                    window.location.reload(); //刷新页面
                } else {
                    alert('删除失败，请稍后再试');
                }
            },
            error: function() {
                alert('请求失败，请稍后再试');
            }
        });
    }
});

Dans le code ci-dessus, nous utilisons jQuery pour lier l'événement de clic du bouton de suppression. Lorsque l'utilisateur clique sur le bouton Supprimer, nous obtenons d'abord la valeur d'identification des données et utilisons la fonction de confirmation pour afficher une boîte de confirmation demandant à l'utilisateur s'il souhaite les supprimer. Si l'utilisateur clique pour confirmer, nous enverrons une requête POST au fichier delete.php pour supprimer les données de la base de données.

Remarque : le code dans le fichier delete.php est le suivant :

<?php
//连接数据库
$dsn = &#39;mysql:host=localhost;dbname=test;charset=utf8&#39;;
$username = &#39;root&#39;;
$password = &#39;123456&#39;;
$options = [
    PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, //异常处理模式
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC, //默认的查询结果类型
];
$pdo = new PDO($dsn, $username, $password, $options);

//删除数据
$id = $_POST['id'];
$sql = "DELETE FROM test_table WHERE id = :id";
$stmt = $pdo->prepare($sql);
$stmt->bindParam(':id', $id, PDO::PARAM_INT);
$res = $stmt->execute();

//返回结果
if ($res) {
    echo json_encode(['code' => 0, 'msg' => '删除成功']);
} else {
    echo json_encode(['code' => 1, 'msg' => '删除失败']);
}
?>

Dans le code ci-dessus, nous nous connectons d'abord à la base de données, puis utilisons l'instruction DELETE pour supprimer les données de la base de données. Enfin, nous renvoyons les résultats au format JSON.

3. Modifier les données

En plus de supprimer des données, nous devons souvent modifier des données. Ci-dessous, nous présenterons comment modifier les données via des fenêtres contextuelles.

1. Requête de données

Tout d'abord, nous devons interroger les données qui doivent être modifiées à partir de la base de données et les afficher sur la page pour permettre aux utilisateurs de les modifier.

<?php
//连接数据库
$dsn = &#39;mysql:host=localhost;dbname=test;charset=utf8&#39;;
$username = &#39;root&#39;;
$password = &#39;123456&#39;;
$options = [
    PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, //异常处理模式
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC, //默认的查询结果类型
];
$pdo = new PDO($dsn, $username, $password, $options);

//查询要修改的数据
$id = $_GET['id'];
$sql = "SELECT * FROM test_table WHERE id = :id";
$stmt = $pdo->prepare($sql);
$stmt->bindParam(':id', $id, PDO::PARAM_INT);
$stmt->execute();
$data = $stmt->fetch();
?>

Dans le code ci-dessus, nous obtenons d'abord l'ID des données qui doivent être modifiées via $_GET['id']. Ensuite, nous utilisons l'instruction SELECT pour interroger les données de la base de données.

2. Afficher les données

Ensuite, nous afficherons les données interrogées sur la page pour permettre aux utilisateurs de les modifier. Ici, nous utilisons toujours le formulaire HTML pour remplir les données demandées dans le formulaire.

<form>
    <input type="hidden" name="id" value="<?php echo $data[&#39;id&#39;]; ?>">
    <div>
        <label>Name:</label>
        <input type="text" name="name" value="<?php echo $data[&#39;name&#39;]; ?>">
    </div>
    <div>
        <label>Email:</label>
        <input type="text" name="email" value="<?php echo $data[&#39;email&#39;]; ?>">
    </div>
    <button class="submit-btn">保存</button>
    <button class="cancel-btn" type="button" onclick="history.back()">取消</button>
</form>

Notez que nous avons ajouté un champ masqué au formulaire pour stocker la valeur ID des données qui doivent être modifiées.

3. Modifier les données

Enfin, implémentons la fonction de modification. Lorsque l'utilisateur clique sur le bouton Enregistrer, nous enverrons une requête AJAX pour mettre à jour les données modifiées dans la base de données.

$('.submit-btn').on('click', function() {
    var data = $('form').serialize();
    $.ajax({
        url: 'update.php', //处理修改请求的PHP文件
        type: 'POST',
        data: data,
        success: function(res) {
            if (res.code === 0) {
                alert('修改成功');
                window.location.href = 'index.php'; //跳转到列表页
            } else {
                alert('修改失败，请稍后再试');
            }
        },
        error: function() {
            alert('请求失败，请稍后再试');
        }
    });
});

Dans le code ci-dessus, nous utilisons jQuery pour lier l'événement click du bouton Enregistrer. Lorsque l'utilisateur clique sur le bouton Enregistrer, nous récupérons d'abord toutes les données du formulaire via la fonction de sérialisation et les envoyons au fichier update.php. Ici, nous utilisons la méthode POST pour envoyer des données.

Remarque : le code dans le fichier update.php est le suivant :

<?php
//连接数据库
$dsn = &#39;mysql:host=localhost;dbname=test;charset=utf8&#39;;
$username = &#39;root&#39;;
$password = &#39;123456&#39;;
$options = [
    PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, //异常处理模式
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC, //默认的查询结果类型
];
$pdo = new PDO($dsn, $username, $password, $options);

//修改数据
$id = $_POST['id'];
$name = $_POST['name'];
$email = $_POST['email'];
$sql = "UPDATE test_table SET name = :name, email = :email WHERE id = :id";
$stmt = $pdo->prepare($sql);
$stmt->bindParam(':id', $id, PDO::PARAM_INT);
$stmt->bindParam(':name', $name, PDO::PARAM_STR);
$stmt->bindParam(':email', $email, PDO::PARAM_STR);
$res = $stmt->execute();

//返回结果
if ($res) {
    echo json_encode(['code' => 0, 'msg' => '修改成功']);
} else {
    echo json_encode(['code' => 1, 'msg' => '修改失败']);
}
?>

Dans le code ci-dessus, nous nous connectons d'abord à la base de données, puis utilisons l'instruction UPDATE pour mettre à jour les données dans la base de données. Enfin, nous renvoyons les résultats au format JSON.

Notez que pour faciliter la démonstration, nous utilisons ici la fonction de sérialisation pour convertir les données du formulaire en chaîne, mais dans les projets réels, nous utilisons généralement l'objet FormData pour traiter les données du formulaire afin de prendre en charge des fonctions telles que le téléchargement de fichiers.

4. Résumé

Grâce à l'introduction de cet article, nous avons appris à utiliser la base de données via des fenêtres pop-up PHP. Qu'il s'agisse de suppression ou de modification, nous pouvons utiliser des méthodes similaires pour y parvenir. J'espère que cet article pourra aider les lecteurs. S'il y a quelque chose que vous ne comprenez toujours pas, vous pouvez laisser un message pour en discuter.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!