Comment utiliser JavaScript pour enregistrer les données modifiées dans une base de données MySQL

Dans les applications Web, la base de données MySQL est largement utilisée. Cependant, pour les développeurs qui commencent tout juste à utiliser MySQL, ils peuvent rencontrer certaines difficultés, comme par exemple comment sauvegarder les données modifiées. Cet article explique comment utiliser JavaScript pour enregistrer les données modifiées dans une base de données MySQL.

La première étape consiste à se connecter à la base de données MySQL. Dans ce cas, nous utiliserons Node.js pour nous connecter à MySQL. Pour nous connecter à MySQL, nous devons utiliser le package npm mysql. Ce package est un pilote Node.js pour MySQL, qui peut être utilisé dans un environnement Node.js. Nous pouvons installer MySQL avec la commande suivante.

npm install mysql

Connectez-vous à la base de données MySQL

L'étape suivante consiste à vous connecter à la base de données MySQL à l'aide du pilote dans Node.js. Nous allons créer un fichier appelé db.js contenant le contenu suivant.

const mysql = require('mysql');

const con = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    password: 'password',
    database: 'testdb'
});

module.exports = con;

Nous allons créer une connexion MySQL en utilisant la méthode createConnection. Cette méthode accepte un objet avec les propriétés suivantes :

• host - Nom d'hôte du serveur MySQL
• user - Nom d'utilisateur de l'utilisateur MySQL
• password - Mot de passe de l'utilisateur MySQL
• database - Nom de la base de données MySQL

Nous allons exporter ce Connect afin de pouvoir utilisez-le à partir d'autres fichiers.

Enregistrer les données modifiées

Maintenant que nous sommes connectés à la base de données MySQL, nous pouvons commencer à enregistrer les données modifiées. Supposons que nous ayons un tableau appelé « utilisateurs » avec trois colonnes : identifiant, nom et e-mail. Nous sauvegarderons les données en récupérant ces trois valeurs du formulaire HTML en utilisant JavaScript.

Tout d'abord, nous allons créer un formulaire HTML qui permettra à l'utilisateur de saisir son nom et son email. Le formulaire ressemble à ceci :

<form>
  <input type="text" id="name" name="name" placeholder="Name">
  <input type="email" id="email" name="email" placeholder="Email">
  <button type="button" onclick="save()">Save</button>
</form>

Dans le formulaire, nous avons défini des éléments de saisie pour obtenir le nom et l'adresse e-mail de l'utilisateur. Nous avons également ajouté un élément bouton au formulaire et lui avons attribué un gestionnaire d'événements onclick qui appellera la fonction de sauvegarde.

Maintenant, écrivons du code JavaScript pour enregistrer les données. Ajoutez le script suivant dans index.html.

<script src="db.js"></script>
<script>
function save() {
  const name = document.getElementById('name').value;
  const email = document.getElementById('email').value;

  const sql = `INSERT INTO users (name, email) VALUES ('${name}', '${email}')`;
  
  db.query(sql, function (err, result) {
    if (err) throw err;
    console.log("1 record inserted");
  });
}
</script>

Dans ce script, nous obtenons d'abord le nom et l'adresse e-mail saisis par l'utilisateur. Ensuite, nous utilisons ces valeurs pour créer une instruction INSERT qui insère les données saisies par l'utilisateur dans la table des utilisateurs de la base de données MySQL.

Nous utilisons la méthode de requête de MySQL pour exécuter des requêtes SQL. Cette méthode reçoit deux paramètres : la requête SQL et une fonction de rappel. La fonction de rappel est appelée après l'exécution de la requête. Dans la fonction de rappel, nous pouvons vérifier s'il y a des erreurs et afficher le nombre d'enregistrements insérés.

Maintenant, lorsque l'utilisateur entre son nom et son adresse e-mail et clique sur le bouton Enregistrer, nous utiliserons JavaScript pour enregistrer les données dans la base de données MySQL.

Conclusion

Enregistrer les modifications apportées à une base de données MySQL à l'aide de JavaScript n'est pas difficile. Dans cet article, nous avons expliqué comment se connecter à une base de données MySQL et utiliser JavaScript pour obtenir des données à partir d'un formulaire HTML, puis enregistrer les données dans la base de données MySQL. Si vous rencontrez des problèmes, veuillez lire la documentation officielle du package mysql npm pour plus d'aide.

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!