ileauchiens/maquette_backoffice
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mise a jour DOM page modifier categorie

Browse Source
This commit is contained in:
ben
2025-12-11 16:34:46 +01:00
parent 74a04ea355
commit 63592a114d
5 changed files with 27 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
blog/html/ajouter_article.html
View File

@@ -144,7 +144,7 @@
</div> </div>
<script src="../js/ajouter_article.js"></script> <script src="../js/ajouter_article.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> <script src="../../node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.tiny.cloud/1/1up68ybfp3crmpssl9o7pu6d0e8v3okcnsinhoujnmak7wft/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script> <script src="https://cdn.tiny.cloud/1/1up68ybfp3crmpssl9o7pu6d0e8v3okcnsinhoujnmak7wft/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script>
<script> <script>
@@ -158,27 +158,9 @@ tinymce.init({
</script> </script>
</body> </body>
</html> </html>
<!--ClassicEditor
.create(document.querySelector('#articleContent'), {
language: 'fr',
toolbar: [
'heading',
'bold', 'italic',
'bulletedList', 'numberedList',
'undo', 'redo'
]
})
.catch(error => {
console.error(error);
});

2
blog/html/ajouter_categorie.html
View File

@@ -104,7 +104,7 @@
</div> </div>
<script src="../js/ajouter_categorie.js"></script> <script src="../js/ajouter_categorie.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> <script src="../../node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
</body> </body>
</html> </html>

2
blog/html/modifier_article.html
View File

@@ -179,7 +179,7 @@
</script> </script>
<script src="../js/modifier_article.js"></script> <script src="../js/modifier_article.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> <script src="../../node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
</body> </body>
</html> </html>

19
blog/html/modifier_categorie.html
View File

@@ -5,17 +5,9 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Modifier une catégorie</title> <title>Modifier une catégorie</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="../../css/blog.css">
<style>
body {
background: #f4f6f981;
}
.container {
margin: 50px auto;
}
</style>
</head> </head>
<body> <body>
@@ -75,10 +67,7 @@
<div class="container"> <div class="container">
<h2 class="mb-5 text-center">Modifier une catégorie</h2> <h2 class="mb-5 text-center">Modifier une catégorie</h2>
<div id="errorMsg" class="alert alert-danger d-none">Veuillez ezmplir tous les champs obligatoires</div>
<div id="successMsg" class="alert alert-success d-none">La catégorie a été modifiée avec succès !</div>
<form id="modifierCategorie"> <form id="modifierCategorie">
@@ -103,7 +92,7 @@
</div> </div>
<script src="../js/modifier_categorie.js"></script> <script src="../js/modifier_categorie.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script> <script src="../../node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>

29
blog/js/modifier_categorie.js
View File

@@ -1,25 +1,36 @@
const form = document.getElementById("modifierCategorie"); const form = document.getElementById("modifierCategorie");
const nameField = document.getElementById("categoryName"); const nameField = document.getElementById("categoryName");
const descField = document.getElementById("categorieDescription"); const descField = document.getElementById("categorieDescription");
const errorMsg = document.getElementById("errorMsg");
const successMsg = document.getElementById("successMsg"); // Fonction pour afficher un message Bootstrap
function showMessage(type, message) {
// Création de l'alert
const alert = document.createElement("div");
alert.className = `alert alert-${type} mt-3`;
alert.textContent = message;
// Ajout en haut du formulaire
form.prepend(alert);
// Suppression automatique après 2 secondes
setTimeout(() => {
alert.remove();
}, 2000);
}
form.addEventListener("submit", function (e) { form.addEventListener("submit", function (e) {
e.preventDefault(); e.preventDefault();
// Vérification des champs obligatoires // Vérification des champs obligatoires
if (nameField.value.trim() === "" || descField.value.trim() === "") { if (nameField.value.trim() === "" || descField.value.trim() === "") {
errorMsg.classList.remove("d-none"); showMessage("danger", "Veuillez remplir tous les champs obligatoires");
successMsg.classList.add("d-none");
return; return;
} }
// Succès // Message succès
errorMsg.classList.add("d-none"); showMessage("success", "La catégorie a été modifiée avec succès !");
successMsg.classList.remove("d-none");
// Redirection après succès // Redirection après succès
setTimeout(() => { setTimeout(() => {
window.location.href = "../html/accueil_blog.html"; window.location.href = "../html/accueil_blog.html";
}, 1500); }, 1500);