• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Einstellungen per localhost speichern und abrufen.

G

glupto

New member
Hallo, ich möchste, dass der Nutzer meiner website auf einer Einstellungsseite per clickbox anklicken kann, welche der angebotenen Inhalte (feeds) er sehen will und wieviele Zeilen davon, dass ist eigentlich alles, was man einstellen können soll. Das Ganze will ich per js oder php im localStorage speichern und abrufen. Ich habe aber Schwierigkeiten damit, die Clickbox-Eingaben in ein Array zu packen und dann das array als Daten (Schlüssel=Medien bzw. Zeilen) in den Storage zu packen und herauszulesen. Vielleicht hat jemand einen Tipp für mich, wie ich da am geschicktesten vorgehe. Bin absoluter js-Anfänger, habe mittlere php-Kenntnisse.

Gruß glupto
 
Wo genau liegt denn dein Problem und was hast du bis jetzt gecodet?
Für das was du vor hast benötigst du ausschließlich JS
 
Bisher habe ich nur Bruchstücke. Die Einstellungsseite:

Code: 
<h1>"WÄHLEN SIE DIE MEDIEN AUS, DIE SIE ANGEZEIGT BEKOMMEN WOLLEN"</h1>
<div class="border">
<a href="http://www.tagesschau.de" target='_blank'>
<img src="logos/tagesschau.jpg" alt="Quelle: Tagesschau" title= "Quelle: Tagesschau" style="margin: 3px 0px 5px 
-45px ; padding:0px;"/></a>
<br> <input type="checkbox" name="medium[]" />
</div> <div class="border">
<a href="http://www.heute.de/" target='_blank'> 
<img src="logos/heutelogo.jpg" alt="ZDF" title= "Quelle: ZDF" style=" margin:3px 0px 5px -45px ; padding:0px;"/></a>
<input type="checkbox" name="medium[]" /></div>
<div class="border"> <a href="http://www.deutschlandfunk.de/nachrichten.353.de.html" target='_blank'>  <img src="logos/dlf.jpg" alt="Deutschlandfunk" title= "Quelle: Deutschlandfunk" style=" margin:3px 0px 5px -45px ; padding:0px;"/></a>  
 </div>

usw.

Beim Speichern und Auslesen habe ich experimentiert mit:

Code: 
<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>

Und bei der Ausgabe habe ich php angewendet:
Code: 
<?php
if (isset($_POST['absenden'])){
    if ($_POST['Zeilen']=="10"){
        echo "10 Zeilen";
    }
    if ($_POST['Zeilen']=="7"){
        echo "7 Zeilen";
    }
    //mit der Schleife foreach werden alle Elemente eines Arrays 
    //ausgegeben
    echo "Sie haben folgende Medien ausgewählt: <br>";
    foreach ($_POST['Medium'] as &$value) {
        echo $value."<br>";
    }
}
?>

Ich weiß, dass das alles nicht zusammenpasst, darum meine Frage....
Gruß und Dank glupto
 
localStorage kannst du nur clientseitig abholen, sprich via JS. PHP kannst du da vergessen.
Alles weitere findest du hier HTML5 Web Storage

Wenn du an einer konkreten Stelle nicht weiterkommst dann lass es uns wissen, momentan weiß ich nicht recht wo es bei dir hapert
 
ich meinte übrigens "checkbox", nicht clickbox...

Ja, Danke für den Link, aber allgemein habe ich mich schon eingelesen. Nur wie ich die Ergebnisse der checkboxen (Medium 1 = ja, Medium 2 = nein usw.) in ein array mit Ergebnissen in den Localstorage bekommen und wieder auslese, weiß ich ich nicht. Naja, werde mal versuchen, ob ich es konkreter ausdrücken kann....
 
speicher es doch als String kommagetrennt (ja,nein) und splitte es nach dem auslesen wieder als array.
Warum machst du denn nicht zwei Einträge in den Storage?
 
Also im Grunde fängt es schon damit an, dass ich nicht weiß, wie ich die Ergebnisse des Formulars auswerte, also vom HTML-Formular in den PHP-String (oder js?), also theoretisch z. B. als ja/nein oder 0/1 (Ich kenne mich halt mit der Formularauswertung auch nicht so aus, also dieser _POST-Kram.

Wenn es dann in einem String ist, nenne ich den Key z. B. "Auswahl" und packe den String per localStorage.setItem("key", "string"); in den localstorage und hole ihn auf der endgültigen Seite, die die Auswahl abbilden soll wieder ab - das kann ich mir vorstellen...
 
Hallo, habe jetzt erstmal das Ganze in eine php-Datei ausgeben lassen, aber an der Stelle hätte ich gern das "localStorage.setItem", aber wie binde ich da eine js-Funktion oder das "localStorage.setItem" direkt ein?

Code: 
<form action="__ausgabe.php" method="post" >
<input type="checkbox" name="auswahl[]" value="http://www.tagesschau.de">Tagesschau<br>
<input type="checkbox" name="auswahl[]" value="http://www.spiegel.de">Spiegel<br>
<input type="checkbox" name="auswahl[]" value="http://www.heute.de">Heute<br>
<input type="checkbox" name="auswahl[]" value="http://www.deutschlandfunk.det">Deutschlandfunk<br>
<input type="checkbox" name="auswahl[]" value="http://www.inforadio.de">Inforadio<br>
<input type="checkbox" name="auswahl[]" value="http://www.br.de">BR<br>
<input type="checkbox" name="auswahl[]" value="http://www.sueddeutsche.de">Süddeutsche<br>
<input type="checkbox" name="auswahl[]" value="http://www.fr.de">FR<br>
<input type="submit" value="go!">
</form>
 
Wenn du auf ajax verzichten möchtest kannst du ganz altmodisch JS mit PHP kombinieren
Code: 
<script>
var auswahl = '<?=$_POST['auswahl'];?>';
</script>
das dann speichern

- - - Aktualisiert - - -

vorher natürlich prüfen ob die Variable einen Inhalt hat und ob er realistisch ist, is ja klar ;)
 
Danke, aber
müsste das nicht
Code: 
<script>
var auswahl = '<?PHP=$_POST['auswahl'];?>';
</script>
heißen?
(und wie ist das in js mit den einfachen und doppelten Anführungsstrichen, ich weiß, dass das bei PHP so nicht ginge...

und geht das nicht einfacher ohne PHP, indem ich die checkbox-Werte gleich beim Abschicken (go) gar nicht erst in eine Ausgabe.php - Datei schreibe, sondern gleich in den localstorage schreibe. Aber ich weiß nicht wie ich mit "action=" statt eienr php-Ausgabe einen localstorage-Speicher - Befehl gebe...(Ich bin wirklich js-Anfänger!), also sorry für evtl. dumme Fragen...

ALso ich habe z. B. in einer anderen Formular-Auswertung folgendes gesehen:

Code: 
form name="myform" onSubmit="JavaScript:handleClick()">

Habe versucht, das zu variieren:

Code: 
<form action="JavaScript:speichern()" method="post" >

und speichern wäre diese Funktion:

Code: 
function speichern() {
 var key = document.getElementById('medien').value;
 var data = document.getElementById('auswahl').value;
 window.localStorage.setItem(key, data);
}

Aber das funktioniert nicht, sicher aus gutem Grund...
 
Zuletzt bearbeitet:
Sind diese checkboxen das einzige in diesem Formular?
Dann mach doch einfach mit jquery eine durchlaufende Abfrage dann brauchst du auch kein Formular sondern nur noch die checkboxen
Code: 
<input type="checkbox" data-url='http://www.tagesschau.de">Tagesschau<br>
<input type="checkbox" data-url='http://www.spiegel.de">Spiegel<br>
<script>
function speichern(){
     i=1;
     $("input[type='checkbox']").each(function(){
          var dataURL	= $(this).attr('data-url');
          if($(this).is(":checked")){
               localStorage.setItem(i, dataURL);
               i++;
          }
     }).promise().done(function(){
          alert('Ihre Auswahl wurde erfolgreich gespeichert');
     });
}
</script>
Ist ungetestet!
Die speichern() function kannste jetzt mit nem Button abrufen
 
Zuletzt bearbeitet:
Tut mir leid, aber da passiert nix.

Code: 
<input type="checkbox" data-url="http://www.tagesschau.de">Tagesschau<br>
<input type="checkbox" data-url="http://www.spiegel.de">Spiegel<br>
<input type="checkbox" data-url="http://www.inforadio.de">Inforadio<br>
<script>
function speichern(){
     i=1;
     $("input[type='checkbox']").each(function(){
          var dataURL	= $(this).attr('data-url');
          if($(this).is(":checked")){
               localStorage.setItem(i, dataURL);
               i++;
          }
     }).promise().done(function(){
          alert('Ihre Auswahl wurde erfolgreich gespeichert');
     });
}


</script>

<input type="submit" value="speichern" onsubmit="JavaScript:speichern();">

Welches wäre denn hier der key für den localStorage, muss der nich zugewiesen werden (z.B. Medien) und müssen die Werte nicht in einem array abgespeichert werden?
 
kein onsubmit, du schickst nix ab :)
Edit fiddle - JSFiddle

hab noch localStorage.clear(); reingemacht, damit er vor dem speichern erstmal alles platt macht, sonst speicherst du ja immer nur positive events

wie verarbeitest du denn die werte später? das ganze in einen einzigen storage zu packen in einem array ist auch möglich
 
Zuletzt bearbeitet:
Ich möchte in der "home"-seite zu Beginn abrufen, ob etwas im localStorage steht und wenn ja, das in ein php-array packen und dann jedes bei der jetzigen Version vorhandene Medium darauf abbprüfen, ob es im array ist und dann jeweils anzeigen oder überspringen, damit der Nutzer "seine" selbst zusammengestellte Seite bekommt.

Dank und Gruß glupto
 
also in der Fiddle kommt ein Alert dass es gespeichert wurde, und in meinem local.storage sind die daten gespeichert
Steht etwas in deiner Fehlerkonsole?
 
Komisch, ja jetzt kommt der alert schon (vorher nicht). Aber (sorry für die dumme Frage): in welchem array stehen die Daten (ausgabe?), und wie lese ich es aus in einer anderen Seite, also: indem in es mit localStorage.getItem('auswahl'); per Schleife in ein php-array packe?
 
ja auswahl ist der string (kommagetrennt), kannst es ja nur clientseitig abrufen also mit js, das jetzt wieder in ein PHP array zu packen wäre dreckig, wie ist denn dein weiteres vorgehen?
Was passiert auf der anderen seite? Geht das nicht mit JS?
 
Bisher mach ich folgendes: (Auszug)
Code: 
<div class="border">
 <a href="http://www.heute.de/" target='_blank'> 
<img src="logos/heutelogo.jpg" alt="ZDF" title= "Quelle: ZDF" style=" margin:3px 0px 5px -45px ; padding:0px;"/></a>
<ul> <?php $string=cachetest("http://www.heute.de/?view=rss","zdf"); verarbeiteFeed($string,10); ?> </ul></div>
<div class="border"> <a href="http://www.deutschlandfunk.de/nachrichten.353.de.html" target='_blank'>  <img src="logos/dlf.jpg" alt="Deutschlandfunk" title= "Quelle: Deutschlandfunk" style=" margin:3px 0px 5px -45px ; padding:0px;"/></a>  <?php feedholen("http://www.deutschlandfunk.de/nachrichten.353.de.rss",10); ?> </div>

<div class="border"><a href="http://www.br.de/themen/aktuell/inhalt/nachrichten/index.html" target='_blank'> 
<img src="logos/b5aktuell.jpg" alt="Bayerischer Rundfunk" title= "Quelle: Bayerischer Rundfunk" style=" margin:3px 0px 5px -45px ; padding:0px;"/></a>
<ul> <?php $string=cachetest("http://www.br.de/nachrichten/meldungen/nachrichten-bayerischer-rundfunk100~newsRss.xml","br"); verarbeiteFeed($string,10); ?> </ul></div>

In der Funktion "cachetest" prüfe ich, wie alt die cache-Datei des feeds ist, falls zu alt, wird er neu von der Quelle geholt, sonst aus dem cache geholt und aufbereitet. siehe Nachrichtentisch. js benutze ich (als plugins) bisher nur für das "back to top"-scrollen, für das Erzeugen und Gestalten von tooltipps und bei der mobilversion Nachrichtentisch für das flexible gestalten der Seite je nach Display-Größe (responsible).

Jetzt hatte ich vor, zu Beginn jedes php-stringtests zu fragen: Bist Du im localstorage array als gewünscht enthalten bzw. jeden php Aufruf als externe Datei zu laden oder eben nicht. Wahrscheinlich umständlich...
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben