Il est possible d'ajouter des documents à une collection
Créez une nouvelle application
Saisissez, étudiez et testez cet exemple
index.html
<!doctype html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Ajax</title>
<script src="lib/jquery-2.1.4.min.js"></script>
<script src="javascript/script.js"></script>
</head>
<body>
<form id="monForm">
<p>Nom <input type='text' id="nom"></p>
<p>Prénom <input type='text' id="prenom"></p>
<p>Genre <input type='radio' name='genre' value='F' checked>Féminin</input>
<input type='radio' name='genre' value='M'>Masculin</input></p>
<p>Age <input type='number' id="age"></p>
<input type="submit" value="Valider" id="envoyer">
</form>
<div id="liste"></div>
</body>
</html>
script.js
$(function(){
function affiche (){
$.ajax({
type :'GET',
url : '/api/affiche',
success : function(data){
$('#liste').html('');
$('#liste').append('<h1>Liste des adhérents</h1>');
for (var i=0;i<data.length;i++){
$('#liste').append('<p>Nom : '+data[i].nom+'</p>');
$('#liste').append('<p>Prénom : '+data[i].prenom+'</p>');
$('#liste').append('<p>Age : '+data[i].age+'</p>');
$('#liste').append('<p>Genre : '+data[i].sexe+'</p>');
$('#liste').append('<br>');
}
}
})
}
$('#monForm').on('submit',function(e){
e.preventDefault();
var nomForm=$('#nom').val();
var prenomForm=$('#prenom').val();
var genreForm=$('input[name=genre]:checked').val()
var ageForm=$('#age').val();
$.ajax({
type:'POST',
url:'/api/formulaire',
data:{nom:nomForm,prenom:prenomForm,age:ageForm,sexe:genreForm,secret:true},
success:function(){
affiche();
$('#nom').val('');
$('#prenom').val('');
$('#age').val('');
}
});
})
affiche();
});
serveur.js
var express = require('express');
var bodyParser = require('body-parser');
var MongoClient = require('mongodb').MongoClient;
var app = express();
app.use('/javascript', express.static(__dirname + '/javascript'));
app.use('/lib', express.static(__dirname + '/lib'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.get('/', function (req, res) {
res.sendFile(__dirname + '/html/index.html');
});
app.get('/api/affiche', function(req, res) {
MongoClient.connect("mongodb://localhost:27017/maDB", function(err, db) {
if(err) {
console.log("erreur de connexion DB en GET");
}
db.collection('fiches').find().toArray(function(err, items) {
res.json(items);
});
});
});
app.post('/api/formulaire', function(req,res) {
MongoClient.connect("mongodb://localhost:27017/maDB", function(err, db) {
if(err) {
console.log("erreur de connexion DB en POST");
}
db.collection('fiches').insert(req.body)
});
res.send();
});
console.log("Connexion serveur OK "+new Date().toString());
app.listen(8080);
L'exemple ci-dessus ressemble beaucoup à l'application développé dans le "À faire vous-même 6.1", mais nous utilisons ici une base de données à la place d'un tableau pour stocker les données
La seule véritable nouveauté se situe dans le fichier "serveur.js" :
db.collection('fiches').insert(req.body)
Cette ligne vous permet d'insérer un document dans la collection "fiches", elle doit se trouver dans la fonction de callback de la méthode 'connect'
J'ai aussi ajouté une ligne qui vous permet de savoir à quelle heure le serveur a été lancé :
console.log("Connexion serveur OK "+new Date().toString());
Il est aussi possible de supprimer un(des) document(s) d'une collection à l'aide de la ligne suivante :
db.collection('fiches').remove({key:val})
L'utilisation de "remove" a déjà été vue dans les activités "Initiation aux bases de données" ici.
Cette commande doit, une fois de plus, se placer dans la fonction de callback de la méthode "connect" (comme pour "insert").
Créez une nouvelle application
Cette application devra afficher les données se trouvant dans la collection "fiches" de la base de données "maDB". Un champ texte (balise input) devra permettre de supprimer un document simplement en entrant le nom de la personne dont la fiche doit être supprimée. Si aucune fiche ne correspond au nom saisi, l'application devra afficher "désolé, aucune fiche portant le nom Toto n'a été trouvée." (si le nom recherché est Toto). Si la fiche est supprimée, le message "La fiche Toto a bien été supprimée" (si le nom recherché est Toto).
La requête "update" fonctionne, ici aussi, exactement comme vous l'avez appris dans les activités "Initiation aux bases de données" (voir ici)
db.collection('fiches').update({nom :"Martin"},{$set :{secret:false}})
Ici aussi, cette commande doit se placer dans la fonction de callback de la méthode "connect" (comme pour "insert").