Ich habe ein umfangreiches mehrseitige Formular in RSForms gebaut.
Der Kunde verlangt jetzt die Möglichkeit, dass die Daten erhalten bleiben, auch wenn der User das Browserfenster neu lädt. Der Hintergrund: der User soll die Möglichkeit haben, während dem Ausfüllen des Formulars auf eine andere Seite zu wechseln, um dort Informationen zu holen, die bereits eingegebene Daten sollen dann aber nicht verloren sein, auch wenn er nicht bis zum Ende des Formulars gegangen ist und dort auf submit geklickt hat.
Jetzt gibt es ja die Möglichkeit, Daten im Browser zwischen zuspeichern. Ich habe dazu ein Script gefunden. Siehe unten.
Das blöde ist nur, dass dieses Script die Daten, die aus der Datenbank kommen, die der Kunde vorher schon einmal gespeichert und wieder neu aufgerufen hat, überschreibt.
Gibt es eine Möglichkeit diese Script so zu verändern, dass erst die Daten aus der Datenbank gelesen werden, dann aber weitere Änderungen über die Browserspeicherung zwischengespeichert werden, bis der User wieder auf submit klickt?
Hier das script:
<script>
$('document').ready(function(){
$('input[type="text"], textarea').each (
function(index){
var field = $(this).attr("id");
$(this).val(localStorage.getItem(field));
}
);
$('input[type="radio"]').each(
function(index){
var field = $(this).attr("name");
if(localStorage.getItem(field)) {
var value = localStorage.getItem(field);
$("[id='"+value+"']").prop('checked',true);
}
}
);
$('input[type="checkbox"]').each(
function(index){
var field = $(this).attr("name");
if(localStorage.getItem(field)) {
var value = localStorage.getItem(field);
$("[id='"+value+"']").prop('checked',true);
}
}
);
$('input[type="text"], textarea').on('input', function() {
var Uniq = $(this).attr("id");
var Content = $(this).val();
localStorage.setItem(Uniq, Content);
});
$('input:radio').on('change', function() {
var Uniq = $(this).attr("name");
var Content = $(this).attr("id");
localStorage.setItem(Uniq, Content);
});
$('input[type="checkbox"]').on('change', function() {
var Uniq = $(this).attr("name");
var Content = $(this).attr("id");
localStorage.setItem(Uniq, Content);
});
});
</script>