Inhalt aus Inputfeld nehmen und Text suchen

  • Hallo Zusammen,


    ich habe ein Inputfeld wo ein Text bzw. eine Nummer eingetragen wird. Aktuell wird diese Nummer in eine JSON übergeben.

    Ich würde aber gerne noch mehr Input mitgeben und zwar zu der Nummer der dazugehörigen Text.

    Bin leider kein Profi und konnte auch mit meinen Recherchen im Internet nicht die nötigen Ansatzpunkte finden.


    Wie könnte man das machen? Auf eine Datenbank kann ich nicht zurückgreifen, da ich technisch sehr eingeschränkt bin (läuft auf einen ESP). Die Struktur der Daten müsste also lokal passieren. Was auch nicht schlimm ist, da sich die Werte eigentlich nicht ändern (Nummer=NameLiedStück)

    Also kann das ganze sehr starr aufgebaut werden wenn nötig.

    Wäre super wenn ihr mir helfen könntet.
    Danke :)

  • Mal sehen ob ich das richtig verstehe: Der Benutzer gibt also etwas ein und damit sollen Daten aus einem Datenbestand gefunden und angezeigt werden?

    Und was diesen Datenbestand betrifft schreibst Du:

    Zitat

    Auf eine Datenbank kann ich nicht zurückgreifen, da ich technisch sehr eingeschränkt bin (läuft auf einen ESP). Die Struktur der Daten müsste also lokal passieren.

    Lokal gibt es localStorage für kleinere Datenbestände und indexedDB für größere. Beides ist jedoch nicht nur an den Computer gebunden sondern auch an den Browser. D. h. von einem anderen Computer aus könntest Du auf diese Daten nicht zugreifen.


    Du schreibst zwar, dass deine Möglichkeiten auf dem ESP eingeschränkt sind, ich finde da aber einiges über SQLite-Bibliotheken. Vielleicht doch eine Möglichkeit?

  • Schon mal danke für die Hilfe. Es handelt sich um ein GitHub Projekt mit dem ich den esp geflasht habe. Also irgendwas nachträglich imstallieren ist leider nicht drin. Im Endeffekt habe ich dort einen Folder in dem ich die .html ablege. Die .html Seite ist von der Funktion so das ich dort einen Http post absende mit einer json.

    Meine idee wäre es mit einem array zu machen… aber einfach zu wenig erfahrung. Bin aus der Hardwaresparte…

  • OK, dann scheidet eine Datenbank auf dem ESP also definitiv aus.

    Und die genannten Einschränkungen, dass die Daten nur auf dem eigenen Computer verfügbar sind, könntest Du damit leben? Man könnte sie händisch per USB-Stick oder Email auf einen anderen bringen und dort einlesen.


    Zitat

    Die .html Seite ist von der Funktion so das ich dort einen Http post absende mit einer json.

    Das verstehe ich auch noch nicht: Du schickst das JSON von deinem lokalen Computer an den ESP? Und was passiert dort damit?

  • Einlesen wäre nicht das Problem. Es handelt sich hierbei um etwas was sich sehr selten ändert.

    Am besten erkläre ich mal das projekt.

    Ich nutze Preisschildertags wie man sie aus dem Supermarkt kennt als Anzeige für unseren Musikverein. Accesspoint und Steuereinheit ist in dem Fall der ESP. Unser Dirigent kann mit dem Tablet eine .html Seite aufrufen die auf dem AP liegt. Dort gibt er die Nummer des nächsten Stückes und dann wird eine JSON erstellt und per http POST „übertragen“. Alles lokal auf dem ESP. Das funktioniert wunderbar. Jetzt wäre aber die Idee noch zusätzlich den Namen des Stückes anzuzeigen. Also Eingabe 123 = Musikstückxy. Und das ganze muss dann auch noch in die json.


    Bin gerade unterwegs. Ich stelle nachher mal die .html zur Verfügung.

  • Nö, der ESP ist der Accesspoint und der Sender für die Tags. Dieser bearbeitet auch die JSON auf, die dann als Bild auf die "Anzeigetags" übertragen werden.

    Noten werden da nicht übertragen. Nur die Liednummer was als nächstes dran kommt.

    Jetzt wäre halt die Idee noch den eigentlichen Liednamen mitanzuzeigen. Eingegeben vom Kapellmeister wird aber nur die Nr.


    Hier mal die html die der Kapellmeister aufruft was sehr gut funktioniert.

  • Guten Abend,

    das ist ja wirklich eine überschaubare Anzahl an Elementen oder hast Du das JSON gekürzt?

    Ich dachte zunächst daran, einfach das JSON im Quelltext um die Texte zu erweitern aber das geht nicht, wenn ich das richtig verstehe, weil die HTML-Seite vom ESP kommt und Du sie dort nicht ändern kannst. Sehe ich das richtig? Auch das Einfügen von zusätzlichem Javascript ist dann nicht möglich.

    Mir fällt da die Lösung ein, die Änderungen durch ein Userscript mit Tampermonkey zu machen, dafür müsste diese Erweiterung im Browser installiert werden. Wäre das eine Möglichkeit?

    Ich schließe jetzt erst Mal den Tag ab, gute Nacht. Vielleicht kann sich heute Abend noch jemand anders dieser Sache annehmen.

  • PS, Ich vergaß ganz: Man könnte auch daran denken, eine unabhängige Seite lokal abzulegen. Dann würde man aber Probleme mit der SOP bekommen, wenn man diese einfach öffnet und mit dem file-Protokoll lädt.

  • Nö, die JSON Ist nicht gekürzt. Das ist alles ;) Also die Seite kann man ändern. Die habe ich erstellt. Die kann ich also jederzeit austauschen gegen das was ich will.

    Wenn möglich wäre es super die Daten (es handelt sich hier um ca. 250 Datensätze bestehend aus "NR" und "NAME", direkt in diese .html einzufügen?!

    Wie schon gesagt, bin da ein Depp ;) Die jetztige .html konnte ich gerade so erstellen mit meinen Wissen, aber jetzt das ganze noch mit etwas zu vergleichen, da beißt es bei mir aus.

  • Zitat

    Also die Seite kann man ändern. Die habe ich erstellt. Die kann ich also jederzeit austauschen gegen das was ich will.

    Das ist ja schon mal eine gute Nachricht und vereinfacht die Sache stark.


    Zitat

    es handelt sich hier um ca. 250 Datensätze bestehend aus "NR" und "NAME"

    Das verstehe ich jetzt wieder nicht: Im JSON in der HTML-Datei nur wenige Einträge und jetzt um 250?

  • Mit den 250 meine ich den Wertevorrat der gegen die Nr. die der Kapellmeister über die .html eingibt geprüft wird. Sollte ein Treffer vorhanden soll ich in die JSON noch der "NAME" des Musikstückes mitgeben werden.

  • OK, ich denke, jetzt verstehe ich es: Das JSON gibt die Struktur eines Konzertes wieder und dort sollen dynamisch die Texte aus dem Vorrat von 250 eingetragen werden.


    Gibt es die 250 Stücke denn schon in irgend einer Form als Datei, z. B. Excel, so dass man sie durch ein Skript einlesen könnte? 250 sind ja schon ein ganze Menge und es wäre viel Arbeit, sie von Hand einzutragen.

  • So ungefähr.


    In der .html kann der Kapellmeister z.B. auswählen/eingeben: "TOILETTEN-PAUSE" Dann wird, wenn er auf den Button "übertragen" klickt, ein "JSON UPLOAD" durchgeführt mit folgender JSON:


    Auszug:


    Code
                } else if (verein === "toilettenpause") {
                    json = [
                                {"text": [74,5,"MUSIKKAPELLE","fonts/bahnschrift20",1]},
                                {"text": [60,36,"PINKELPAUSE","fonts/calibrib30",1]},
                                {"text": [26,70,"Zackig zurück sein !","fonts/calibrib30" ,1]},
                                {"text": [48,105,"Ort","fonts/bahnschrift20",1]}
                    ];

    Sollte er jetzt "Musikstück" auswählen und dann die NR eingeben soll im Hintergrund der Name des Musikkstückes übergeben werden


    Die JSON würde dann ungefähr so aus sehen:


    Code
                var json;
                var verein = document.querySelector('input[name="verein"]:checked').value;
                if (verein === "liednummer1") {
                    var nummer1 = document.getElementById("nummer1").value;
                    var liedname = ??????????????????????
                    json = [
                                {"text":[74,5,"MUSIKKAPELLE","fonts/bahnschrift20",1]},
                                {"text":[83,36,nummer1,"fonts/calibrib80",1]},
                                {"text":[95,36,liedname,"fonts/calibrib80",1]},
                                {"text":[48,105,"ORT","fonts/bahnschrift20",1]}



    Aktuell gibt es das ganze als Inhaltsverzeichnis als word Datei, wäre kein Problem die in in ein gewisses Format zu bringen. Weiß aber nicht wie diese aussehen soll/muss


    EDIT: Da er auch zwei NR eingeben kann, muss die suche auch für zwei Nr. gehen ;)

  • Excel wäre günstiger als Word weil man das als CSV exportieren kann und dann problemlos durch ein Skript auswerten. Vielleicht kann man da etwas machen, dass Du es irgend wie nach Excel herüber bringst?

  • Das Ganze gestaltet sich viel einfacher als ich zunächst erwartet hatte. Als ersten Schritt schlage ich vor, dass wir das mit festem Javascript machen:

    Ich habe die wenigen Einträge in der CSV-Datei von Hand umeditiert. Füge dies in das Javascript oben ein:

    Dann kannst Du in dem Code aus #14 den Text ganz einfach aus der Nummer ermitteln:

    Code
                var json;
                var verein = document.querySelector('input[name="verein"]:checked').value;
                if (verein === "liednummer1") {
                    var nummer1 = document.getElementById("nummer1").value;
                    var liedname = liednamen[nummer1]; // <-- hier
                    json = [
                                {"text":[74,5,"MUSIKKAPELLE","fonts/bahnschrift20",1]},
                                {"text":[83,36,nummer1,"fonts/calibrib80",1]},
                                {"text":[95,36,liedname,"fonts/calibrib80",1]},
                                {"text":[48,105,"ORT","fonts/bahnschrift20",1]}

    Ich dachte zunächst daran, eine Funktion holeLiedName zu machen aber wie Du siehst ist das so einfach, dass es nicht lohnt.


    Wenn das funktioniert, gehen wir daran, die CSV-Datei zu laden und auszuwerten.

  • WOW, ich bin begeistert. Es funktioniert. FREU MICH SO

    DANKE.


    Einlesefunktion wäre tatsächlich übertrieben. So kann ich wunderbar leben. Wie schon gesagt, da sind so wenig Änderungen und ich müsste auch die CSV jedesmal aufarbeiten, da macht es vom Zeitaufwand wenig Sinn.


    Ich bringe das ganze jetzt mal in hübsch und schicke ein paar Fotos wie das ganze fertig aussieht.


    Ich sage auf jeden Fall vielen, vielen Dank Sempervivum

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!