<!DOCTYPE html> | |||||
<html> | |||||
<head> | |||||
<meta charset="utf-8" /> | |||||
<meta name="viewport" content="width=device-width, initial-scale=1"> | |||||
<title>Notizen</title> | |||||
<link rel="icon" href="img/faviconNotiz.ico"> | |||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> | |||||
<link rel="stylesheet" href="/css/mobile.css"> | |||||
</head> | |||||
<body> | |||||
<nav class="navbar navbar-expand-lg navbar-light bg-light"> | |||||
<div class="container"> | |||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarMenu"> | |||||
<span class="navbar-toggler-icon"></span> | |||||
</button> | |||||
<div class="collapse navbar-collapse" id="navbarMenu"> | |||||
<ul class="navbar-nav"> | |||||
<li><a class="nav-link active" href="/Eintrag/">Einträge</a></li> | |||||
<li><a class="nav-link" href="/">Home</a></li> | |||||
</ul> | |||||
</div> | |||||
</div> | |||||
</nav> | |||||
<div class="container"> | |||||
<h1 class="title">Notizeinträge</h1> | |||||
<h2> | |||||
Eintrag | |||||
</h2> | |||||
<p>Einträge zu Einkaufsnotizen.</p> | |||||
<p>Hier ensteht eine Übersicht.</p> | |||||
<img src="/einkaufswagen.jpg" alt="Foto von mir"> | |||||
<p>Christian :-)</p> | |||||
<script src="/lib/es6-shim.min.js"></script> | |||||
<script src="/lib/jquery-2.2.4.min.js"></script> | |||||
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> | |||||
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script> | |||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script> | |||||
<script src="/scripts/notizen.js"></script> | |||||
<!-- The core Firebase JS SDK is always required and must be listed first --> | |||||
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-app.js"></script> | |||||
<!-- TODO: Add SDKs for Firebase products that you want to use | |||||
https://firebase.google.com/docs/web/setup#available-libraries --> | |||||
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-analytics.js"></script> | |||||
<script> | |||||
// Your web app's Firebase configuration | |||||
var firebaseConfig = { | |||||
apiKey: "AIzaSyBGML4iAFtqv-l1Xxcguk9rww82060MqVY", | |||||
authDomain: "notizenapp-e3416.firebaseapp.com", | |||||
databaseURL: "https://notizenapp-e3416.firebaseio.com", | |||||
projectId: "notizenapp-e3416", | |||||
storageBucket: "notizenapp-e3416.appspot.com", | |||||
messagingSenderId: "794357045429", | |||||
appId: "1:794357045429:web:5035e6ba66cb4b534786fc", | |||||
measurementId: "G-CRZFWJ08LQ" | |||||
}; | |||||
// Initialize Firebase | |||||
firebase.initializeApp(firebaseConfig); | |||||
firebase.analytics(); | |||||
</script> | |||||
</div> | |||||
</body> | |||||
</html> |
| |||||
.title { | |||||
font-size: 65px; | |||||
} | |||||
h2 small { | |||||
color: rgb(228, 122, 35); | |||||
font-size: large; | |||||
} | |||||
h2 { | |||||
background-color: #607d8b; | |||||
color: #ffffff; | |||||
} | |||||
img { | |||||
display: block; | |||||
margin-left: auto; | |||||
margin-right: auto; | |||||
width: 50%; | |||||
} |
<!DOCTYPE html> | |||||
<html> | |||||
<head> | |||||
<meta charset="utf-8" /> | |||||
<meta name="viewport" content="width=device-width, initial-scale=1"> | |||||
<title>Notizen</title> | |||||
<link rel="icon" href="img/faviconNotiz.ico"> | |||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> | |||||
<link rel="stylesheet" href="css/mobile.css"> | |||||
</head> | |||||
<body> | |||||
<div class="container"> | |||||
<h1 class="title">Notizen</h1> | |||||
<h2> | |||||
Willkommen! | |||||
<small>Meine Notizen mobil verfügbar</small> | |||||
</h2> | |||||
<form> | |||||
<div class="form-group"> | |||||
<label for="exampleInputEmail1">Email Addresse</label> | |||||
<input type="email" class="form-control" id="InputEmail1" aria-describedby="emailHelp" placeholder="Email"> | |||||
<small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small> | |||||
</div> | |||||
<div class="form-group"> | |||||
<label for="exampleInputPassword1">Passwort</label> | |||||
<input type="password" class="form-control" id="InputPassword1" placeholder="Password"> | |||||
</div> | |||||
<div class="form-check"> | |||||
<input type="checkbox" class="form-check-input" id="exampleCheck1"> | |||||
<label class="form-check-label" for="exampleCheck1">Check me out</label> | |||||
</div> | |||||
<button type="submit" class="btn btn-light" id="btnLogin">Login</button> | |||||
<button type="submit" class="btn btn-primary" id="btnSignUp">Sign Up</button> | |||||
<button type="submit" class="btn btn-secondary" id="btnLogout">Logout</button> | |||||
</form> | |||||
<script src="lib/jquery-2.2.4.min.js"></script> | |||||
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> | |||||
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script> | |||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script> | |||||
<!-- The core Firebase JS SDK is always required and must be listed first --> | |||||
<script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-app.js"></script> | |||||
<script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-analytics.js"></script> | |||||
<script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-auth.js"></script> | |||||
<script src="https://www.gstatic.com/firebasejs/7.15.0/firebase-firestore.js"></script> | |||||
<script> | |||||
// Your web app's Firebase configuration | |||||
var firebaseConfig = { | |||||
apiKey: "AIzaSyBGML4iAFtqv-l1Xxcguk9rww82060MqVY", | |||||
authDomain: "notizenapp-e3416.firebaseapp.com", | |||||
databaseURL: "https://notizenapp-e3416.firebaseio.com", | |||||
projectId: "notizenapp-e3416", | |||||
storageBucket: "notizenapp-e3416.appspot.com", | |||||
messagingSenderId: "794357045429", | |||||
appId: "1:794357045429:web:5035e6ba66cb4b534786fc", | |||||
measurementId: "G-CRZFWJ08LQ" | |||||
}; | |||||
// Initialize Firebase | |||||
firebase.initializeApp(firebaseConfig); | |||||
firebase.analytics(); | |||||
</script> | |||||
<script src="index.js"></script> | |||||
</div> | |||||
</body> | |||||
</html> |
//Get elements | |||||
const txtEmail = document.getElementById('InputEmail1'); | |||||
const txtPassword = document.getElementById('InputPassword1'); | |||||
const btnLogin = document.getElementById('btnLogin'); | |||||
const btnSignUp = document.getElementById('btnSignUp'); | |||||
const btnLogout = document.getElementById('btnLogout'); | |||||
// Add login event | |||||
btnLogin.addEventListener('click', e => { | |||||
// Get email and pass | |||||
const email = txtEmail.value; | |||||
const pass = txtPassword.value; | |||||
const auth = firebase.auth(); | |||||
// Sign in | |||||
const promise = auth.signInWithEmailAndPassword(email, pass); | |||||
promise.catch(e => console.log(e.message)); | |||||
promise.then(function (user) { | |||||
// success | |||||
console.log("Email: " + user.email); | |||||
window.location.href = "notizenEintrag.html"; | |||||
}) | |||||
}); | |||||
// Add signup event | |||||
btnSignUp.addEventListener('click', e => { | |||||
// Get email and pass | |||||
const email = txtEmail.value; | |||||
const pass = txtPassword.value; | |||||
const auth = firebase.auth(); | |||||
// Sign in | |||||
const promise = auth.createUserWithEmailAndPassword(email, pass); | |||||
promise.catch(e => console.log(e.message)); | |||||
promise.then(function (user) { | |||||
// success | |||||
console.log("Email: " + user.email); | |||||
window.location.href = "notizenEintrag.html"; | |||||
}) | |||||
alert("SignUp gedrückt"); | |||||
}); | |||||
btnLogout.addEventListener('click', e => { | |||||
firebase.auth().signOut(); | |||||
}); | |||||
window.onload = init; | |||||
function init() { | |||||
var button = document.getElementById('mehr'); | |||||
button.onclick = ToDoHinzufügen; | |||||
var clearButton = document.getElementById('loeschen'); | |||||
clearButton.onclick = allesLöschen; | |||||
var eintraegeArray = HolEinträge(); | |||||
for (var i = 0; i < eintraegeArray.length; i++) { | |||||
var aufgabeNr = eintraegeArray[i]; | |||||
var value = JSON.parse(localStorage[aufgabeNr]); | |||||
insDOMschreiben(aufgabeNr, value); | |||||
} | |||||
} | |||||
function HolEinträge() { | |||||
var eintraegeArray = localStorage.getItem('eintraegeArray'); | |||||
if (!eintraegeArray) { | |||||
eintraegeArray = []; | |||||
localStorage.setItem('eintraegeArray', JSON.stringify(eintraegeArray)); | |||||
} else { | |||||
eintraegeArray = JSON.parse(eintraegeArray); | |||||
} | |||||
return eintraegeArray; | |||||
} | |||||
function ToDoHinzufügen() { | |||||
var eintraegeArray = HolEinträge(); | |||||
var value = document.getElementById('eingabe').value; | |||||
if(value!='') | |||||
{ | |||||
var currentDate = new Date(); | |||||
var aufgabeNr = 'aufgabe_' + currentDate.getTime() | |||||
var aufgabeText = {'value': value}; | |||||
localStorage.setItem(aufgabeNr, JSON.stringify(aufgabeText)); | |||||
eintraegeArray.push(aufgabeNr); | |||||
localStorage.setItem('eintraegeArray', JSON.stringify(eintraegeArray)); | |||||
insDOMschreiben(aufgabeNr, aufgabeText); | |||||
document.getElementById('eingabe').value=' '; | |||||
} | |||||
else | |||||
{ | |||||
alert('Bitte geben Sie etwas ein!'); | |||||
} | |||||
} | |||||
function toDoLöschen(e) { | |||||
var aufgabeNr = e.target.id; | |||||
var eintraegeArray = HolEinträge(); | |||||
if (eintraegeArray) { | |||||
for (var i = 0; i < eintraegeArray.length; i++) { | |||||
if (aufgabeNr == eintraegeArray[i]) { | |||||
eintraegeArray.splice(i,1); | |||||
} | |||||
} | |||||
localStorage.removeItem(aufgabeNr); | |||||
localStorage.setItem('eintraegeArray', JSON.stringify(eintraegeArray)); | |||||
ausDOMentfernen(aufgabeNr); | |||||
} | |||||
} | |||||
function insDOMschreiben(aufgabeNr, ItemObj) { | |||||
var eintraege = document.getElementById('eintraege'); | |||||
var eintrag = document.createElement('li'); | |||||
eintrag.setAttribute('id', aufgabeNr); | |||||
eintrag.innerHTML = ItemObj.value; | |||||
eintraege.appendChild(eintrag); | |||||
eintrag.onclick = toDoLöschen; | |||||
} | |||||
function ausDOMentfernen(aufgabeNr) { | |||||
var eintrag = document.getElementById(aufgabeNr); | |||||
eintrag.parentNode.removeChild(eintrag); | |||||
} | |||||
function allesLöschen() { | |||||
localStorage.clear(); | |||||
var ItemList = document.getElementById('eintraege'); | |||||
var eintraege = ItemList.childNodes; | |||||
for (var i = eintraege.length-1; i >= 0; i--) { | |||||
ItemList.removeChild(eintraege[i]); | |||||
} | |||||
var eintraegeArray = HolEinträge(); | |||||
} | |||||
<!DOCTYPE html> | |||||
<html> | |||||
<head> | |||||
<meta charset="utf-8" /> | |||||
<meta name="viewport" content="width=device-width, initial-scale=1"> | |||||
<title>Notizen</title> | |||||
<link rel="icon" href="img/faviconNotiz.ico"> | |||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> | |||||
<link rel="stylesheet" href="css/mobile.css"> | |||||
</head> | |||||
<body> | |||||
<nav class="navbar navbar-expand-lg navbar-light bg-light"> | |||||
<div class="container"> | |||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarMenu"> | |||||
<span class="navbar-toggler-icon"></span> | |||||
</button> | |||||
<div class="collapse navbar-collapse" id="navbarMenu"> | |||||
<ul class="navbar-nav"> | |||||
<li><a class="nav-link active" href="/">Home</a></li> | |||||
<li><a class="nav-link" href="/Eintrag/">Einträge</a></li> | |||||
</ul> | |||||
</div> | |||||
</div> | |||||
</nav> | |||||
<div class="container"> | |||||
<h1 class="title">Notizen</h1> | |||||
<h2> | |||||
Willkommen! | |||||
<small>Meine Notizen mobil verfügbar</small> | |||||
</h2> | |||||
<form> | |||||
<label for="EinkaufsInput" >Einkaufsnotiz hinzufügen: </label> | |||||
<input id="EinkaufsInput" value="" placeholder="Eingabe tätigen" type="text"> | |||||
<button id="mehrEinkaufen">neuen Eintrag hinzufügen</button> | |||||
</form> | |||||
<form> | |||||
<label for="NotizInput" >Alternative Notiz hinzufügen: </label> | |||||
<input id="NotizInput" value="" placeholder="Eingabe tätigen" type="text"> | |||||
<button id="mehrNotiz">neuen Eintrag hinzufügen</button> | |||||
</form> | |||||
<script src="notizen.js"></script> | |||||
<img src="einkaufswagen.jpg" alt="Foto von mir"> | |||||
<p>Christian :-)</p> | |||||
<script src="lib/es6-shim.min.js"></script> | |||||
<script src="lib/jquery-2.2.4.min.js"></script> | |||||
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> | |||||
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script> | |||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script> | |||||
<!-- The core Firebase JS SDK is always required and must be listed first --> | |||||
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-app.js"></script> | |||||
<!-- TODO: Add SDKs for Firebase products that you want to use | |||||
https://firebase.google.com/docs/web/setup#available-libraries --> | |||||
<script src="https://www.gstatic.com/firebasejs/7.14.6/firebase-analytics.js"></script> | |||||
<script> | |||||
// Your web app's Firebase configuration | |||||
var firebaseConfig = { | |||||
apiKey: "AIzaSyBGML4iAFtqv-l1Xxcguk9rww82060MqVY", | |||||
authDomain: "notizenapp-e3416.firebaseapp.com", | |||||
databaseURL: "https://notizenapp-e3416.firebaseio.com", | |||||
projectId: "notizenapp-e3416", | |||||
storageBucket: "notizenapp-e3416.appspot.com", | |||||
messagingSenderId: "794357045429", | |||||
appId: "1:794357045429:web:5035e6ba66cb4b534786fc", | |||||
measurementId: "G-CRZFWJ08LQ" | |||||
}; | |||||
// Initialize Firebase | |||||
firebase.initializeApp(firebaseConfig); | |||||
firebase.analytics(); | |||||
</script> | |||||
</div> | |||||
</body> | |||||
</html> |
<meta charset="utf-8" /> | <meta charset="utf-8" /> | ||||
<meta name="viewport" content="width=device-width, initial-scale=1"> | <meta name="viewport" content="width=device-width, initial-scale=1"> | ||||
<title>Notizen</title> | <title>Notizen</title> | ||||
<link rel="icon" href="img/faviconNotiz.ico"> | |||||
<link rel="icon" href="../img/faviconNotiz.ico"> | |||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> | <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> | ||||
<link rel="stylesheet" href="css/mobile.css"> | |||||
<link rel="stylesheet" href="../css/mobile.css"> | |||||
</head> | </head> | ||||
<body> | <body> | ||||
<nav class="navbar navbar-expand-lg navbar-light bg-light"> | <nav class="navbar navbar-expand-lg navbar-light bg-light"> | ||||
</button> | </button> | ||||
<div class="collapse navbar-collapse" id="navbarMenu"> | <div class="collapse navbar-collapse" id="navbarMenu"> | ||||
<ul class="navbar-nav"> | <ul class="navbar-nav"> | ||||
<li><a class="nav-link active" href="/Eintrag/">Notizen</a></li> | |||||
<li><a class="nav-link" href="/">Neue Notiz eintragen</a></li> | |||||
<li><a class="nav-link active" href="eintraege.html">Notizen lesen</a></li> | |||||
<li><a class="nav-link" href="../index.html">Neue Notiz eintragen</a></li> | |||||
</ul> | </ul> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
Übersicht | Übersicht | ||||
</h2> | </h2> | ||||
Text: <br> | |||||
<textarea id="elem"></textarea> <br> | |||||
<p class="font-weight-bold" id="data"></p> | |||||
<form> | <form> | ||||
<div class="form-group"> | <div class="form-group"> | ||||
<label for="NotizInputKey">Notiz nach Thema löschen</label> | <label for="NotizInputKey">Notiz nach Thema löschen</label> | ||||
<input type="NotizInputKey" class="form-control" id="key" placeholder="Thema"> | <input type="NotizInputKey" class="form-control" id="key" placeholder="Thema"> | ||||
</div> | </div> | ||||
<div class="form-group shadow-textarea"> | |||||
<textarea class="form-control z-depth-1" id="data" rows="3"></textarea> | |||||
</div> | |||||
<button type="submit" class="btn btn-light" id="delete_key">Notiz nach Thema löschen</button> | <button type="submit" class="btn btn-light" id="delete_key">Notiz nach Thema löschen</button> | ||||
<button type="submit" class="btn btn-light" id="delete_all">Alle Notizen löschen</button> | |||||
</form> | |||||
<button type="submit" class="btn btn-light" id="delete_all">Alle Notizen löschen</button> | |||||
</form> | |||||
<label for="NotizInputKey">Notiz nach Thema suchen</label> | |||||
<input type="NotizInputKey" class="form-control" id="inputKey" placeholder="Thema"> | |||||
<button type="submit" class="btn btn-light" id="search">Notiz nach Thema suchen</button> | |||||
<p class="font-weight-bold" >Gesuchte Notiz:</p> | |||||
<p class="font-weight-bold" id="givenKey"></p> | |||||
<p class="font-weight-bold" id="notice"></p> | |||||
<script src="notizenAusgabe.js"></script> | |||||
<script src="../scripts/notizenAusgabe.js"></script> | |||||
<script src="lib/es6-shim.min.js"></script> | <script src="lib/es6-shim.min.js"></script> |
</button> | </button> | ||||
<div class="collapse navbar-collapse" id="navbarMenu"> | <div class="collapse navbar-collapse" id="navbarMenu"> | ||||
<ul class="navbar-nav"> | <ul class="navbar-nav"> | ||||
<li><a class="nav-link active" href="/">Neue Notiz eintragen</a></li> | |||||
<li><a class="nav-link" href="/Eintrag/">Notizen</a></li> | |||||
<li><a class="nav-link active" href="index.html">Neue Notiz eintragen</a></li> | |||||
<li><a class="nav-link" href="Eintrag/eintraege.html">Notizen lesen</a></li> | |||||
</ul> | </ul> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<small>Meine Notizen mobil verfügbar</small> | <small>Meine Notizen mobil verfügbar</small> | ||||
</h2> | </h2> | ||||
Text: <br> | |||||
<textarea id="elem"></textarea> <br> | |||||
<form> | <form> | ||||
<div class="form-group"> | <div class="form-group"> | ||||
<textarea class="form-control z-depth-1" id="data" rows="3" placeholder="Schreibe etwas..."></textarea> | <textarea class="form-control z-depth-1" id="data" rows="3" placeholder="Schreibe etwas..."></textarea> | ||||
</div> | </div> | ||||
<button type="submit" class="btn btn-light" id="Speichern">Neue Notiz speichern</button> | <button type="submit" class="btn btn-light" id="Speichern">Neue Notiz speichern</button> | ||||
<button type="submit" class="btn btn-primary" id="Lesen" >Notizen lesen</button> | |||||
<button type="submit" class="btn btn-light" id="delete_key">Notiz nach Thema löschen</button> | |||||
<button type="submit" class="btn btn-light" id="delete_all">Alle Notizen löschen</button> | |||||
</form> | </form> | ||||
<script src="notizen.js"></script> | |||||
<script src="scripts/notizen.js"></script> | |||||
<img src="einkaufswagen.jpg"> | <img src="einkaufswagen.jpg"> | ||||
const btnWeiterleiten = document.getElementById('Lesen'); | |||||
const btnSpeichern = document.getElementById('Speichern'); | |||||
const btnLoeschenKey = document.getElementById('delete_key'); | |||||
const btnAllesLoeschen = document.getElementById('delete_all'); | |||||
function speichern() { | |||||
var key = document.getElementById('key').value; | |||||
var data = document.getElementById('data').value; | |||||
window.localStorage.setItem(key, data); | |||||
alert(data); | |||||
} | |||||
function weiterleiten() { | |||||
window.open('eintraege.html','Lesen'); | |||||
} | |||||
btnSpeichern.addEventListener('click', e => { | |||||
speichern()}); | |||||
btnWeiterleiten.addEventListener('click', e => { | |||||
weiterleiten()}); | |||||
function loeschen() { | |||||
var key = document.getElementById('key').value; | |||||
window.localStorage.removeItem(key); | |||||
alert(key); | |||||
} | |||||
function allesLoeschen() { | |||||
window.localStorage.clear(); | |||||
} | |||||
btnLoeschenKey.onclick | |||||
btnLoeschenKey.addEventListener('click', e => { | |||||
loeschen()}); | |||||
btnAllesLoeschen.addEventListener('click', e => { | |||||
allesLoeschen()}); | |||||
const btnLoeschenKey = document.getElementById('delete_key'); | |||||
const btnAllesLoeschen = document.getElementById('delete_all'); | |||||
auslesen(); | |||||
function auslesen() { | |||||
var count = window.localStorage.length; | |||||
for (let i=0; i<=count; i++) { | |||||
var keyname = window.localStorage.key(i); | |||||
document.getElementById('elem').value = window.localStorage.getItem("Haus"); | |||||
} | |||||
} | |||||
function loeschen() { | |||||
var key = document.getElementById('key').value; | |||||
window.localStorage.removeItem(key); | |||||
} | |||||
function allesLoeschen() { | |||||
window.localStorage.clear(); | |||||
} | |||||
btnLoeschenKey.addEventListener('click', e => { | |||||
loeschen()}); | |||||
btnAllesLoeschen.addEventListener('click', e => { | |||||
allesLoeschen()}); | |||||
const btnSpeichern = document.getElementById('Speichern'); | |||||
const btnLoeschenKey = document.getElementById('delete_key'); | |||||
const btnAllesLoeschen = document.getElementById('delete_all'); | |||||
function speichern() { | |||||
var key = document.getElementById('key').value; | |||||
var data = document.getElementById('data').value; | |||||
window.localStorage.setItem(key, data); | |||||
} | |||||
btnSpeichern.addEventListener('click', e => { | |||||
speichern()}); | |||||
const btnSuchen = document.getElementById('search'); | |||||
const btnLoeschenKey = document.getElementById('delete_key'); | |||||
const btnAllesLoeschen = document.getElementById('delete_all'); | |||||
auslesen(); | |||||
function auslesen() { | |||||
var count = window.localStorage.length; | |||||
var displayData = document.getElementById('data'); | |||||
displayData.innerHTML = ""; | |||||
if (typeof(Storage) !== "undefined") { | |||||
for (let i=0; i<count; i++) { | |||||
var keyname = window.localStorage.key(i); | |||||
var data = window.localStorage.getItem(keyname); | |||||
displayData.innerHTML += keyname+": "+data+"<br>"; | |||||
} | |||||
} else { | |||||
displayData.innerHTML = "Entschuldigung, Ihr Browser unterstützt nicht Web Storage..."; | |||||
} | |||||
} | |||||
function finden() { | |||||
var keyname = document.getElementById('inputKey').value; | |||||
var givenKey = document.getElementById('givenKey'); | |||||
var notice = document.getElementById('notice'); | |||||
givenKey.innerHTML = ""; | |||||
notice.innerHTML = ""; | |||||
var data = window.localStorage.getItem(keyname); | |||||
givenKey.innerHTML = keyname +":"; | |||||
notice.innerHTML = data; | |||||
} | |||||
function loeschen() { | |||||
var key = document.getElementById('key').value; | |||||
window.localStorage.removeItem(key); | |||||
} | |||||
function allesLoeschen() { | |||||
window.localStorage.clear(); | |||||
} | |||||
btnSuchen.addEventListener('click', e => { | |||||
finden()}); | |||||
btnLoeschenKey.addEventListener('click', e => { | |||||
loeschen()}); | |||||
btnAllesLoeschen.addEventListener('click', e => { | |||||
allesLoeschen()}); | |||||
<!DOCTYPE html> | |||||
<html> | |||||
<head> | |||||
<script> | |||||
function speichern() { | |||||
var key = document.getElementById('key').value; | |||||
var data = document.getElementById('data').value; | |||||
window.localStorage.setItem(key, data); | |||||
} | |||||
function lesen() { | |||||
var key = document.getElementById('key').value; | |||||
document.getElementById('data').value = window.localStorage.getItem(key); | |||||
} | |||||
</script> | |||||
</head> | |||||
<body> | |||||
Text: <br> | |||||
<textarea id="data"></textarea> <br> | |||||
Schlüssel: <input type="text" id="key"> | |||||
<input type="button" id="save" value="Speichern"> | |||||
<script> | |||||
var btnSpeichern = document.getElementById('save'); | |||||
btnSpeichern.addEventListener('click', e => { | |||||
speichern()}); | |||||
</script> | |||||
<input type="button" value="Lesen" onclick="lesen()"> | |||||
</body> | |||||
</html> |
<!DOCTYPE html> | |||||
<html> | |||||
<head> | |||||
<script> | |||||
function speichern() { | |||||
var key = document.getElementById('key').value; | |||||
var data = document.getElementById('data').value; | |||||
window.localStorage.setItem(key, data); | |||||
} | |||||
function lesen() { | |||||
var key = document.getElementById('key').value; | |||||
document.getElementById('data').value = window.localStorage.getItem(key); | |||||
} | |||||
</script> | |||||
</head> | |||||
<body> | |||||
Text: <br> | |||||
<textarea id="data"></textarea> <br> | |||||
Schlüssel: <input type="text" id="key"> | |||||
<input type="button" value="Speichern" onclick="speichern()"> | |||||
<input type="button" value="Lesen" onclick="lesen()"> | |||||
</body> | |||||
</html> |