manier om local storage op te slaan in php variable
Ik vraag mij echter af of er een manier is om de waarde van deze local storage in een php variable op te slaan die ik vervolgens weer kan opslaan in de database. Dat zou namelijk heel wat werk schelen t.o.v. elk element afzonderlijk te benoemen.
In principe zou dus dan alleen de waarde van de local storage in 1 variable per pagina te hoeven worden opgeslagen. Dan hoef ik ook maar 1 waarde vanuit de database in te laden. Ik heb geen idee of dit uberhaupt mogelijk is.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<div class="card">
<h2 id="title" contenteditable>Titel hier</h2>
<p id="content" contenteditable>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Hic molestiae dolor, veritatis ex provident quia vero odit ducimus fugiat illo repudiandae doloribus. Quibusdam aliquid, quasi ipsam sint ab porro ex?</p>
</div>
<script>
const editables = document.querySelectorAll("[contenteditable]");
// save edits
editables.forEach(el => {
el.addEventListener("blur", () => {
localStorage.setItem("dataStorage-" + el.id, el.innerHTML);
})
});
// once on load
for (var key in localStorage) {
if (key.includes("dataStorage-")) {
const id = key.replace("dataStorage-","");
document.querySelector("#" + id).innerHTML = localStorage.getItem(key);
}
}
</script>
<h2 id="title" contenteditable>Titel hier</h2>
<p id="content" contenteditable>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Hic molestiae dolor, veritatis ex provident quia vero odit ducimus fugiat illo repudiandae doloribus. Quibusdam aliquid, quasi ipsam sint ab porro ex?</p>
</div>
<script>
const editables = document.querySelectorAll("[contenteditable]");
// save edits
editables.forEach(el => {
el.addEventListener("blur", () => {
localStorage.setItem("dataStorage-" + el.id, el.innerHTML);
})
});
// once on load
for (var key in localStorage) {
if (key.includes("dataStorage-")) {
const id = key.replace("dataStorage-","");
document.querySelector("#" + id).innerHTML = localStorage.getItem(key);
}
}
</script>
Toevoeging op 12/03/2022 11:57:00:
Ik heb al een paar testen uitgevoerd, maar zonder succes. maar wellicht sla ik niet de juiste informatie op in de php variable. Ik hoor het graag of er iemand een idee heeft. Alvast bedankt.
Toevoeging op 12/03/2022 12:13:49:
of is er aan manier om het anders te doen (los van alle elementen los in php op te slaan en via php echo weer weer te geven). als ik via contenteditable content wijzig kan ik in via inspector gelijk de wijziging in de code terugzien. Is er wellicht ook een manier om deze inspector code in php op te slaan?
Gewijzigd op 12/03/2022 11:53:23 door Paul Weiss
De enigste manier om een javascript variabele naar de server te krijgen is door deze via een AJAX request terug te sturen naar de webserver.
Ja klopt. Is inmiddels ook al gelukt.