M_Viper/Material_Verwaltungs_Tool
M_Viper
/
Material_Verwaltungs_Tool
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add_material_form.php aktualisiert

This commit is contained in:
M_Viper 2024-02-25 11:00:01 +00:00
parent 8a91716a34
commit 59bdeb6b6e
1 changed files with 111 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

221
add_material_form.php
View File

@ -1,110 +1,111 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="de"> <html lang="de">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="icon" href="img/favicon.png" type="image/x-icon"> <link rel="icon" href="img/favicon.png" type="image/x-icon">
<title>Materialverwaltung</title> <title>Materialverwaltung</title>
<script> <script>
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
const form = document.getElementById('addMaterialForm'); const form = document.getElementById('addMaterialForm');
form.addEventListener('submit', function(event) { form.addEventListener('submit', function(event) {
event.preventDefault(); // Verhindert das Standardverhalten des Formulars event.preventDefault(); // Verhindert das Standardverhalten des Formulars
// AJAX-Anfrage senden // AJAX-Anfrage senden
const formData = new FormData(form); const formData = new FormData(form);
const xhr = new XMLHttpRequest(); const xhr = new XMLHttpRequest();
xhr.open('POST', 'add_material.php', true); xhr.open('POST', 'add_material.php', true);
xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xhr.onload = function() { xhr.onload = function() {
if (xhr.status === 200) { if (xhr.status === 200) {
const response = JSON.parse(xhr.responseText); const response = JSON.parse(xhr.responseText);
if (response.success) { if (response.success) {
const messageElement = document.createElement('p'); const messageElement = document.createElement('p');
messageElement.textContent = response.message; messageElement.textContent = response.message;
messageElement.style.color = 'green'; messageElement.style.color = 'green';
// Nachricht neben dem Button einfügen // Nachricht neben dem Button einfügen
form.parentNode.insertBefore(messageElement, form.nextSibling); form.parentNode.insertBefore(messageElement, form.nextSibling);
setTimeout(function() { setTimeout(function() {
messageElement.remove(); messageElement.remove();
}, 3000); }, 3000);
// Formular zurücksetzen // Formular zurücksetzen
form.reset(); form.reset();
} else { } else {
const errorMessage = document.createElement('p'); const errorMessage = document.createElement('p');
errorMessage.textContent = response.message; errorMessage.textContent = response.message;
errorMessage.style.color = 'red'; errorMessage.style.color = 'red';
// Fehlermeldung einfügen // Fehlermeldung einfügen
form.parentNode.insertBefore(errorMessage, form.nextSibling); form.parentNode.insertBefore(errorMessage, form.nextSibling);
setTimeout(function() { setTimeout(function() {
errorMessage.remove(); errorMessage.remove();
}, 3000); }, 3000);
} }
} else { } else {
console.error('AJAX-Fehler beim Hinzufügen des Artikels.'); console.error('AJAX-Fehler beim Hinzufügen des Artikels.');
} }
}; };
xhr.onerror = function() { xhr.onerror = function() {
console.error('AJAX-Fehler beim Hinzufügen des Artikels.'); console.error('AJAX-Fehler beim Hinzufügen des Artikels.');
}; };
xhr.send(formData); xhr.send(formData);
}); });
}); });
</script> </script>
</head> </head>
<body> <body>
<header class="header"> <header class="header">
<div class="header-container"> <div class="header-container">
<h1>Materialverwaltung</h1> <h1>Materialverwaltung</h1>
<nav> <nav>
<ul> <ul>
<li><a href="index.php">Home</a></li> <li><a href="index.php">Home</a></li>
<li><a href="add_material_form.php">Artikel hinzufügen</a></li> <li><a href="add_material_form.php">Artikel hinzufügen</a></li>
<li><a href="article_overview.php">Artikel Übersicht</a></li> <li><a href="article_overview.php">Artikel Übersicht</a></li>
</ul> </ul>
</nav> </nav>
</div> </div>
</header> </header>
<div class="add-material-box"> <div class="add-material-box">
<h2>Material hinzufügen</h2> <h2>Material hinzufügen</h2>
<form method="post" action="add_material.php" id="addMaterialForm"> <form method="post" action="add_material.php" id="addMaterialForm">
<div class="form-group"> <div class="form-group">
<label for="item_name">Gegenstand/Medikament:</label> <label for="item_name">Gegenstand/Medikament:</label>
<input type="text" id="item_name" name="item_name" required> <input type="text" id="item_name" name="item_name" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="manufacturer">Hersteller:</label> <label for="manufacturer">Hersteller:</label>
<input type="text" id="manufacturer" name="manufacturer" required> <input type="text" id="manufacturer" name="manufacturer" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="location">Lagerort:</label> <label for="location">Lagerort:</label>
<input type="text" id="location" name="location" required> <input type="text" id="location" name="location" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="amount_should">Anzahl soll:</label> <label for="amount_should">Anzahl soll:</label>
<input type="number" id="amount_should" name="amount_should" required> <input type="number" id="amount_should" name="amount_should" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="amount_is">Anzahl ist:</label> <label for="amount_is">Anzahl ist:</label>
<input type="number" id="amount_is" name="amount_is" required> <input type="number" id="amount_is" name="amount_is" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="expiration_date">Mindesthaltbarkeitsdatum:</label> <label for="expiration_date">Mindesthaltbarkeitsdatum:</label>
<input type="date" id="expiration_date" name="expiration_date" required> <input type="date" id="expiration_date" name="expiration_date" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="barcode">Barcode/EAN:</label> <label for="barcode">Barcode/EAN:</label>
<input type="text" id="barcode" name="barcode" required> <input type="text" id="barcode" name="barcode" required>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="image">Bild (optional):</label> <label for="image">Bild (optional):</label>
<input type="file" id="image" name="image"> <input type="file" id="image" name="image">
</div> </div>
<div class="form-group" style="display: flex; justify-content: flex-end;"> <div class="form-group" style="display: flex; justify-content: flex-end;">
<input type="submit" value="Hinzufügen" class="submit-button"> <input type="submit" value="Hinzufügen" class="submit-button">
</div> </div>
</form> </form>
</div> </div>
</body> </body>
</html> <span class="watermark">© copyright 2024 by M_Viper</span>
</html>