Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[Peoples]

@OliverIO
Ja ich habe das schon angeschaut, aber komme da nicht weiter. Ich möchte im enddefekt so wie im vorherigen Post bei readProjects die Projekte Ordner / Projekte auslesen um diese dann in dein dropdown zu packen.

In der main.js ist das überhaupt kein Problem aber in der index_m.html finde ich keine Möglichkeit.

Hier fehlt es mir schlicht und ergreiffend an Wissen.

[OliverIO]

@Peoples
Wenn du einen Breakpoint in readprojects setzt und im edit Modus neu ladest, dann landest du in dieser Funktion und kannst schauen welche Parameter du übergeben musst und welches Ergebnis sie zurück liefert

[Peoples]

Nach ewigem probieren, bin ich so weit:

function loadProjects() {
  return new Promise(resolve => {
    socket.emit('getState', 'viewswitch.0.existingProjects' , function (err, state) {
        if (state && state.val) {
          var projects = state.val.split(',');
          var text = '<option value="undefined" class="translate">Platzhalter</option>';
          if(projects.length){
                for (var d = 0; d < (projects.length -1); d++) {
                text +='<option value="'+ projects[d] +'" class="translate">'+ projects[d] +'</option>';
                }
          resolve(text);
          } 
        }
    });
  });
}

  loadProjects().then(result => alert(result));      

ausgegeben wird mir dann folgendes:

<option value="undefined" class="translate">Platzhalter</option>
<option value="Wandtablet" class="translate">Wandtablet</option>
<option value="main" class="translate">main</option>

Nun möchte ich natürlich ein in der Admin-Oberfläche vorhandenes Select mit diesen Daten befüllen. Wenn ich es so mache:

let visProjects = '<option value="undefined" class="translate">Platzhalter</option>';
            visProjects += '<option value="Wandtablet" class="translate">Wandtablet</option>';
            visProjects += '<option value="main" class="translate">main</option>';
            $('#visProjects').html(visProjects);

funktioniert das bestens.
Aber wenn ich versuche die Daten meiner Funktion mit:

loadProjects().then(result => $('#select_projects').html(result));

versuche funktioniert das nicht.

Leider hört die von mir gefundene Doku auch bei admin.html auf, und ich habe auch sonst nichts gefunden das ein wenig den Aufbau bzw. die Richtlinien der index_m.html erklärt.

Kann mir einer sagen warum die Ausgabe meiner Funktion keine Füllung des Selects bewirkt?

[OliverIO]

@Peoples

darf ich fragen wo dein code lebt? auf dem server oder auf dem client?

[Peoples]

@OliverIO
klar Oliver, die steht in der index.m.html und sollte somit im client abgearbeitet werden. (Denke ich :-))

[AlCalzone]

@Peoples sagte in Klärung von AdpaterEntwicklungs Fragen:

Kann mir einer sagen warum die Ausgabe meiner Funktion keine Füllung des Selects bewirkt?

Findet der Selektor denn das richtige Element?
$('#select_projects') heißt ja anders als im Code obendrüber.

Wird der then-Callback aufgerufen? --> Log oder Breakpoint einfügen. resolve wird ja nur aufgerufen wenn projects.length > 0 ist.

Steht in result was drin? --> Log oder Breakpoint einfügen, und Inhalt checken.

@Peoples sagte in Klärung von AdpaterEntwicklungs Fragen:

ich habe auch sonst nichts gefunden das ein wenig den Aufbau bzw. die Richtlinien der index_m.html erklärt.

Gibts nicht. Du kannst die frei gestalten, das ist einfach HTML, CSS und JS mit jQuery. Designtechnisch sollte es aber material-design sein.

[Peoples]

@AlCalzone sagte in Klärung von AdpaterEntwicklungs Fragen:

@Peoples sagte in Klärung von AdpaterEntwicklungs Fragen:

Kann mir einer sagen warum die Ausgabe meiner Funktion keine Füllung des Selects bewirkt?

Findet der Selektor denn das richtige Element?
$('#select_projects') heißt ja anders als im Code obendrüber.

Wird der then-Callback aufgerufen? --> Log oder Breakpoint einfügen. resolve wird ja nur aufgerufen wenn projects.length > 0 ist.

Steht in result was drin? --> Log oder Breakpoint einfügen, und Inhalt checken.

Ich bin grad nicht zu Hause schaue aber später. Sollte aber so sein, den alert zeigt ja folgendes an:
<option value="undefined" class="translate">Platzhalter</option>
<option value="Wandtablet" class="translate">Wandtablet</option>
<option value="main" class="translate">main</option>

[OliverIO]

@Peoples

was @AlCalzone meinte ist:
In deinem Versuch der funktioniert verwendest du den selektor #visProjects
und im richtigen Besipiel welches nicht funktioniert verwendest du den selektor #select_projects

[Peoples]

@OliverIO
Ahso, ja das passt habe zwei "select" felder gemacht um zu sehen dass die "Feste" Vorgabe funktioniert, die generierte aber nicht.

Die Ergebnisse wären identisch sollte es funktionieren tut es aber leider nicht

Ich werde hier jetzt erstmal mit dem Thema Adapter aufhören, weil mich das Nervt.
Danke jedenfalls für eure Hilfe.

Vielleicht mach ich da irgendwann nochmal weiter

[OliverIO]

@Peoples

wie oben schon mal geschrieben. für client code im browser:
schreibe in deinen code am anfang das wort

debugger;

oder halt an die stelle, wo der debugger anhalten soll.
öffne die seite in chrome,
öffne die developer tools
mach einen reload
und schwupp bist du da und kannst schritt für schritt deinen code ausführen
und schauen was in den variablen steht.

[AlCalzone]

@OliverIO Alternativ manuell breakpoint setzen (hier mal für ein Skript im Forum):

[OliverIO]

@AlCalzone
Ich glaube soweit ist er noch nicht und die richtige Datei zu finden im source tree ist zu Beginn auch nicht so einfach.