Delete Data
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Data Deletion Request</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background-color: #f0f0f0;
}
.container {
text-align: center;
background-color: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
label {
display: block;
margin-bottom: 8px;
}
input[type="email"] {
width: 100%;
padding: 8px;
margin-bottom: 16px;
border-radius: 4px;
border: 1px solid #ccc;
}
button {
padding: 10px 20px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #0056b3;
}
#confirmation {
margin-top: 20px;
font-weight: bold;
}
</style>
</head>
<body>
<div class="container">
<h1>Data Deletion Request</h1>
<p>Submit this form to request deletion of your data:</p>
<form id="deleteForm">
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<button type="submit">Request Data Deletion</button>
</form>
<p id="confirmation"></p>
</div>
<script>
document.getElementById('deleteForm').addEventListener('submit', function(event) {
event.preventDefault(); // Prevent form submission
// Get the entered email
const email = document.getElementById('email').value;
// Simulate deletion request (replace this with your actual deletion process)
setTimeout(function() {
// Display confirmation message
document.getElementById('confirmation').textContent = `Request received for ${email}. Your data deletion will be processed.`;
// Clear the form after submission
document.getElementById('deleteForm').reset();
}, 1500); // Simulating a delay of 1.5 seconds (1500 milliseconds)
});
</script>
</body>
</html>