oujood.com

Comment ajouter, mitre à jour et supprimer un enregistrement?

Cet article explique comment utiliser le panneau d'administration de Django pour créer, mettre à jour, supprimer ou récupérer les enregistrements d'un modèle et diverses opérations similaires
Jusqu'à présent, nous avons créé une table Membres dans notre base de données et nous avons inséré cinq enregistrements en écrivant du code dans le shell Python.
Nous avons également créé un modèle qui nous permet d'afficher le contenu de la table dans une page Web.
Maintenant, nous voulons être en mesure de créer de nouveaux membres à partir d'une page Web.

chercher |

Django Ajouter un enregistrement

Le Template(Le Modèle)

Commencez par ajouter un bouton dans le modèle index.html du dossier membres. Ce bouton va nous servir pour demmander l'ajout d'un membre.

Fichier membres/templates/index.html:

  Copier le code 

<!DOCTYPE html>
<html>
<head>
<title>Liste des membres</title>
</head>
<body>
<h1>Mes membres</h1>

<table border="1" style="border-collapse: collapse;"><tr><th> ID </th> <th> Prénom </th><th> Nom </th><th>Email</th></tr>
{% for x in mesmembres %}
<tr>
<td>{{ x.id }}</td>
<td>{{ x.prenom }}</td>
<td>{{ x.nom }}</td>
<td>{{ x.mail }}</td>
</tr>
{% endfor %}
</table>
<p>
<a href="ajout/">Ajouter membre</a>
</p>
</body>
</html>

Nouveau template

Ajoutez un nouveau modèle dans le dossier des modèles, nommé ajout.html :

  Copier le code 

<h1>Ajouter un membre</h1>

<form action="ajouterrecord/" method="post">
{% csrf_token %}
Prénom:<br>
<input name="prenom">
<br><br>
Nom :<br>
<input name="nom">
<br><br>
<input type="submit" value="Envoyer">
</form>
Le modèle contient un formulaire HTML vide avec deux champs de saisie et un bouton d'envoi.

Remarque : Django exige cette ligne dans le formulaire :
{% csrf_token %}
C'est pour gérer injections(les requêtes des attaques intersites) dans les formulaires où la méthode est POST

La visualisation : view

Ajoutez ensuite une fonction vue dans le fichier membres/views.py, nommez la nouvelle vue ajout :
Fichier membres/views.py après avoir ajouter la fonction ajout():

  Copier le code 

from django.http import HttpResponse
from django.template import loader
from .models import Membres

def index(request):
  mesmembres = Membres.objects.all().values()
  template = loader.get_template('index.html')
  context = {
    'mesmembres': mesmembres,
  }
  return HttpResponse(template.render(context, request))

def ajout(request):
  template = loader.get_template('ajout.html')
  return HttpResponse(template.render({}, request))

Le fichier des URLs

Ajouter une fonction path() dans le fichier membres/urls.py, qui pointe l'url 127.0.0.1:8000/membres/ajout/ au bon endroit :

Fichier membres/urls.py après avoir ajouter la fonction path():

  Copier le code 

from django.urls import path
from . import views

urlpatterns = [
    path('', views.index, name='index'),
    path('ajout/', views.ajout, name='ajout'),
]
Vous pouvez voir la page ajouter un membre dans le navigateur, tapez l'url :http://localhost:8000/membres/ ou http://127.0.0.1:8000/membres/ dans la barra d'adresse puis cliquez sur le bouton "Ajouter un membre"

Autres URLs

Avez-vous remarqué l'attribut action dans le formulaire HTML ? L'attribut action spécifie où envoyer les données du formulaire, dans ce cas les données du formulaire seront envoyées à une page web addrecord/, donc nous devons ajouter une fonction path() dans le fichier membres/urls.py qui pointe vers la bonne vue :
Fichier membres/urls.py après avoir ajouter la deuxième fonction path():

  Copier le code 

from django.urls import path
from . import views

urlpatterns = [
    path('', views.index, name='index'),
    path('ajout/', views.ajout, name='ajout'),
    path('ajout/ajouterrecord/', views.ajouterrecord, name='ajouterrecord'),
]

Code pour Ajouter des enregistrements

Jusqu'à présent, nous avons créé l'interface utilisateur, et nous avons pointé l'URL vers la vue appelée ajouterrecord, mais nous n'avons pas encore créé la vue.

Assurez-vous que vous ajoutez la vue ajouterrecord dans le fichier membres/views.py :

  Copier le code 

from django.http import HttpResponse, HttpResponseRedirect
from django.template import loader
from django.urls import reverse
from .models import Membres

def index(request):
  mesmembres = Membres.objects.all().values()
  template = loader.get_template('index.html')
  context = {
    'mesmembres': mesmembres,
  }
  return HttpResponse(template.render(context, request))

def ajout(request):
  template = loader.get_template('ajout.html')
  return HttpResponse(template.render({}, request))
  
def ajouterrecord(request):
  x = request.POST['prenom']
  y = request.POST['nom']
  z = request.POST['mail']
  membre = Membres(prenom=x, nom=y, mail=z)
  membre.save()
  return HttpResponseRedirect(reverse('index'))
Changements apportés dans le fichier views.py :

Ligne 1 : import HttpResponseRedirect
Ligne 3 : import reverse

La fonction vue ajouterrecord fait ce qui suit :

Obtient le prénom, le nom et Email avec l'instruction request.POST.
Ajoute un nouvel enregistrement dans la table des membres.
Redirige l'utilisateur vers la vue index.
Essayez d'ajouter un nouvel enregistrement et voyez comment cela fonctionne.

Django Supprimer un enregistrement

Pour supprimer un enregistrement, nous n'avons pas besoin d'un nouveau template, mais nous devons apporter quelques modifications au template membres.

Vous pouvez bien entendu déterminer comment vous désirez ajouter un bouton de suppression, mais dans cet exemple, nous allons ajouter un lien "supprimer" pour chaque enregistrement dans une nouvelle colonne du tableau.

Le lien "supprimer" contiendra également l'ID de chaque enregistrement.

Modifier le template(modèle)

Ajoutez une colonne "supprimer" dans le modèle membres :
Fichier membres/templates/index.html:

  Copier le code 

<!DOCTYPE html>
<html>
<head>
<title>Liste des membres</title>
</head>
<body>
<h1>Mes membres</h1>

<table border="1" style="border-collapse: collapse;"><tr><th> ID </th> <th> Prénom </th><th> Nom </th><th>Email</th><th>   </th</tr>
{% for x in mesmembres %}
<tr>
<td>{{ x.id }}</td>
<td>{{ x.prenom }}</td>
<td>{{ x.nom }}</td>
<td>{{ x.mail }}</td>
<td><a href="delete/{{ x.id }}">supprimer</a></td>
</tr>
{% endfor %}
</table>
<br>
<button>
<a href="ajout/">Ajouter membre</a>
</button>
</body>
</html>

Modifier le fichier URLs

Le lien "supprimer" dans la table HTML pointe vers 127.0.0.1:8000/members/delete/ donc nous allons ajouter une fonction path() dans le fichier members/urls.py, qui pointe l'url vers le bon emplacement, avec l'ID comme paramètre :

Fichier membres/urls.py:

  Copier le code 

from django.urls import path
from . import views

urlpatterns = [
    path('', views.index, name='index'),
    path('ajout/', views.ajout, name='ajout'),
    path('ajout/ajouterrecord/', views.ajouterrecord, name='ajouterrecord'),
    path('delete/<int:idégt;', views.delete, name='delete'),
]

Code pour la suppression des enregistrements

Maintenant nous devons ajouter une nouvelle fonction vue nommée delete dans le fichier membres/views.py :
Fichier membres/views.py :

  Copier le code 

from django.http import HttpResponse, HttpResponseRedirect
from django.template import loader
from django.urls import reverse
from .models import Membres

def index(request):
  mesmembres = Membres.objects.all().values()
  template = loader.get_template('index.html')
  context = {
    'mesmembres': mesmembres,
  }
  return HttpResponse(template.render(context, request))

def ajout(request):
  template = loader.get_template('ajout.html')
  return HttpResponse(template.render({}, request))
  
def ajouterrecord(request):
  x = request.POST['prenom']
  y = request.POST['nom']
  z = request.POST['mail']
  membre = Membres(prenom=x, nom=y, mail=z)
  membre.save()
  return HttpResponseRedirect(reverse('index'))

def delete(request, id):
  membre = Membres.objects.get(id=id)
  membre.delete()
  return HttpResponseRedirect(reverse('index'))
Ce que fait la fonction de suppression delete :

Elle obtient l'identifiant id comme argument.
Utilise l'identifiant pour localiser l'enregistrement correct dans la table Membres.
Supprime cet enregistrement.
Redirige l'utilisateur vers la vue de l'index.

Cliquez sur le lien "supprimer" pour un membre et constatez le résultat.

Mise à jour des enregistrements dans Django

Django vous permet de changer et metre à jour des données particulières pour un enregistrement. Pour mettre à jour un enregistrement, nous avons besoin de l'ID de l'enregistrement, et nous avons besoin d'un template avec une interface qui nous permet de changer les valeurs.

Tout d'abord, nous devons effectuer quelques modifications dans le modèle index.html.

Modifier le template

Commencez par ajouter un lien pour chaque membre de la table :
Fichier membres/templates/index.html:

  Copier le code 

<!DOCTYPE html>
<html>
<head>
<title>Liste des membres</title>
</head>
<body>
<h1>Mes membres</h1>

<table border="1" style="border-collapse: collapse;"><tr><th> ID </th> <th> Prénom </th><th> Nom </th><th>Email</th><th>   </th</tr>
{% for x in mesmembres %}
<tr>
<td><a href="update/{{ x.id }}">{{ x.id }}</a></td>
<td>{{ x.prenom }}</td>
<td>{{ x.nom }}</td>
<td>{{ x.mail }}</td>
<td><a href="delete/{{ x.id }}">supprimer</a></td>
</tr>
{% endfor %}
</table>
<br>
<button>
<a href="ajout/">Ajouter membre</a>
</button>
</body>
</html>
Nous avons créé un lien sur l'ID de chaque membre.
Le lien renvoie à une vue appelée update avec l'ID du membre actuel comme paramètre dans l'url.

Modifier le view

Ajoutez la fonction de mise à jour nommée update dans le fichier members/views.py :

Fichier membres/views.py :

  Copier le code 

from django.http import HttpResponse, HttpResponseRedirect
from django.template import loader
from django.urls import reverse
from .models import Membres

def index(request):
  mesmembres = Membres.objects.all().values()
  template = loader.get_template('index.html')
  context = {
    'mesmembres': mesmembres,
  }
  return HttpResponse(template.render(context, request))

def ajout(request):
  template = loader.get_template('ajout.html')
  return HttpResponse(template.render({}, request))
  
def ajouterrecord(request):
  x = request.POST['prenom']
  y = request.POST['nom']
  z = request.POST['mail']
  membre = Membres(prenom=x, nom=y, mail=z)
  membre.save()
  return HttpResponseRedirect(reverse('index'))

def delete(request, id):
  membre = Membres.objects.get(id=id)
  membre.delete()
  return HttpResponseRedirect(reverse('index'))
  
def update(request, id):
  monmembre = Membres.objects.get(id=id)
  template = loader.get_template('update.html')
  context = {
    'monmembre': monmembre,
  }
  return HttpResponse(template.render(context, request))
La fonction de mise à jour editer() effectue les opérations suivantes :

Elle obtient l'identifiant en tant qu'argument.
Utilise l'identifiant pour localiser l'enregistrement correct dans la table des membres.
Charge un modèle appelé update.html.
Crée un objet contenant le membre.
Envoie l'objet au modèle.
Produit le HTML qui est rendu par le modèle.

Création d'un nouveau template(modèle)

Ajoutez un nouveau modèle dans le dossier templates, nommez le update.html :
Fichier membres/templates/update.html :

  Copier le code 

<h1>Mise à jour d'un membre</h1>

<form action="editer/{{ monmembre.id }}" method="post">
{% csrf_token %}
Prenom:<br>
<input name="prenom" value="{{ monmembre.prenom }}">
<br><br>
Nom :<br>
<input name="nom" value="{{ monmembre.nom }}">
<br><br>
Email :<br>
<input name="mail" value="{{ monmembre.mail }}">
<br><br>
<input type="submit" value=" Mètre à jour ">
</form>
Le template contient un formulaire HTML avec les valeurs du membre sélectionné.

Remarque : Django exige cette ligne dans le formulaire :
{% csrf_token %}
pour gérer les attaques de type intersites (Cross Site Request Forgeries) dans les formulaires où la méthode est POST.

Modifier le fichier des URLs

Ajouter une fonction path() dans le fichier membres/urls.py, qui pointe l'url 127.0.0.1:8000/membres/update/ vers la bonne localisation, avec l'ID comme paramètre :

Fichier membres/urls.py :

  Copier le code 

from django.urls import path
from . import views

urlpatterns = [
    path('', views.index, name='index'),
    path('ajout/', views.ajout, name='ajout'),
    path('ajout/ajouterrecord/', views.ajouterrecord, name='ajouterrecord'),
    path('delete/<int:idégt;', views.delete, name='delete'),
    path('update/<int:idégt;', views.update, name='update'),
]
Dans le navigateur, cliquez sur l'ID du membre que vous voulez modifier et vous êtes rediriger vers la page membre/update/ qui comme nous l'avons vu contient un formulaire avec les données du membre choisi . Vous pouvez changer comme vous voulez les informations dans ce formulaire et cliquer sur envoyer pour mètre à jour les informations dans la base de données .

Que se passe-t-il lors de la soumission ?

Avez-vous remarqué l'attribut action dans le formulaire HTML ? L'attribut action spécifie où envoyer les données du formulaire, dans ce cas les données du formulaire seront envoyées à :

editer/{{ mymember.id }}, nous devons donc ajouter une fonction path() dans le fichier members/urls.py qui pointe vers la bonne vue :
Modifier donc votre fichier urls.py en ajoutant la fonction path() comme dans le code suivant : Fichier membres/urls.py modifié :

  Copier le code 

from django.urls import path
from . import views

urlpatterns = [
    path('', views.index, name='index'),
    path('ajout/', views.ajout, name='ajout'),
    path('ajout/ajouterrecord/', views.ajouterrecord, name='ajouterrecord'),
    path('delete/<int:id>', views.delete, name='delete'),
    path('update/<int:id>', views.update, name='update'),
    path('update/editer/<int:id>', views.editer, name='editer'),
]

Code pour la mise à jour des enregistrements

Jusqu'à présent, nous avons créé l'interface utilisateur, et nous avons pointé l'URL vers la vue appelée editer, mais nous n'avons pas encore créé la vue.

Il faut ajouter la fonction editer() dans le fichier members/views.py :
Fichier membres/views.py final:

  Copier le code 

from django.http import HttpResponse, HttpResponseRedirect
from django.template import loader
from django.urls import reverse
from .models import Membres

def index(request):
  mesmembres = Membres.objects.all().values()
  template = loader.get_template('index.html')
  context = {
    'mesmembres': mesmembres,
  }
  return HttpResponse(template.render(context, request))

def ajout(request):
  template = loader.get_template('ajout.html')
  return HttpResponse(template.render({}, request))
  
def ajouterrecord(request):
  x = request.POST['prenom']
  y = request.POST['nom']
  z = request.POST['mail']
  membre = Membres(prenom=x, nom=y, mail=z)
  membre.save()
  return HttpResponseRedirect(reverse('index'))

def delete(request, id):
  membre = Membres.objects.get(id=id)
  membre.delete()
  return HttpResponseRedirect(reverse('index'))
  
def update(request, id):
  monmembre = Membres.objects.get(id=id)
  template = loader.get_template('update.html')
  context = {
    'monmembre': monmembre,
  }
  return HttpResponse(template.render(context, request))

def editer(request, id):
  prenom = request.POST['prenom']
  nom = request.POST['nom']
  mail = request.POST['mail']
  membre = Membres.objects.get(id=id)
  membre.prenom = prenom
  membre.nom = nom
  membre.mail = mail
  membre.save()
  return HttpResponseRedirect(reverse('index'))
La fonction editer() mettra à jour l'enregistrement dans la table des membres pour l'ID sélectionné.

Lorsque vous appuyez sur le bouton "Mètre à jour", la table des membres est mise à jour.
Cours precedent    Sommaire     Cours suivant



Voir aussi nos tutoriel :

Texte et typographie de Bootstrap Typographie

Bootstrap définit des styles et le formatage de contenu de texte par default comme les titres, paragraphes, blocs de citation, etc

Variable globale de PHP $_POST

Variable globale de PHP $_POST

fonction strtoupper, strtoupper

Renvoie une chaîne en majuscules