Frage von Cscommander, 61

Ergebnisse in Inputs darstellen?

Ich bin zur Zeit dabei einen Rechner für Seiten & Winkel des Dreiecks in JavaScript zu entwerfen. Er kann mit 3 Angaben eine Seite oder Winkel ausrechnen. Diese Ergebnisse werden derzeit aber nur in der Konsole angezeigt und nicht wie im Bild zu sehen in den Inputs. Ich bin noch relativ am Anfang mit der Programmierung. Das Script geht unten noch weiter, für mich ist aber nur als Beispiel die oberste If Abfrage am wichtigsten. Danke für die Antworten!

Hilfreichste Antwort - ausgezeichnet vom Fragesteller
von Minilexikon, 21

Kannst du mal deinen Code auf http://codepen.io oder http://pastebin.com stellen, damit er einfacher für uns zu lesen ist? Ich habe mal grob den Anfang versucht, umzusetzen: http://codepen.io/Minilexikon/pen/xEQxXo?editors=0010#0

Kommentar von Cscommander ,

Ich werde mich heute im Laufe des Tages mit einem Link melden. Danke im Voraus!

Kommentar von Cscommander ,

http://pastebin.com/vr4EgrjH hier der Code. Also nochmal zum Verständnis. Es ist ein Rechner für Seiten und Winkel im Dreieck. (Ich bin auch ein totaler Leihe!). Wenn man 3 Eingaben eingibt, kann eine Seite oder Winkel ausgerechnet werden (noch kein Endstadium). Dieses Ergebnis wird derzeit noch in der Konsole präsentiert. Es soll aber eben in die Felder rein, in denen beispielsweise Alpha steht, ich nenne sie Inputs, da man da ja auch die anderen Eingaben tätigt, also direkt auf der Website. Danke im Voraus ich hoffe du kannst mir helfen.

Kommentar von Minilexikon ,

Okay, danke für den Code. Der ist wirklich ziemlich riesig und irgendwo hast du

  • seiteA,seiteB,seiteC
  • seiteB,seiteC,seiteA
  • seiteC,seiteB,seiteA

oder so. Ergibt das an der Stelle Sinn?

Ich werde mal schauen, wie man deinen Code vereinfachen kann.

Ich würde dir empfehlen, mit jQuery zu arbeiten und die große Funktion in noch weitere kleiner auszulagern und eine Fehlerüberprüfung einzubauen, mithilfe derer du feststellen kannst, ob auch wirklich exakt drei Felder ausgefüllt wurden.

Ist das der Fall, kannst du aus deinen einzelnen ifs eine if-else-Struktur bauen, was die Performance deines Scriptes anheben dürfte.

Kommentar von Cscommander ,

Danke für die schnelle Antwort. Hab auch erst vor kurzem damit angefangen..

Kommentar von Minilexikon ,

Ich bin jetzt mathematisch nicht mehr so in dem Thema, aber sag mal, wie viele Kombinationsmöglichkeiten gibt es für diesen Rechner denn?

Alles gut. Ich denke, wir bekommen das hin ;)

Kommentar von Cscommander ,

zur Zeit gibt es 18 Kombinationsmöglichkeiten um eine Seite oder Winkel zu bestimmen, weil man ja verschiedene Eingaben tätigen kann. Später soll das dann noch so ablaufen, dass wenn man 3 Eingaben eingibt, alle restlichen angezeigt werden.

Kommentar von Minilexikon ,

Anzahl der Angaben

  • Kosinussätze Seiten: 3
  • Kosinussätze Winkel: 3
  • Sinussätze Seiten: 6
  • Sinussätze Winkel: 6

Da stimmt noch irgendwas nicht...^^
Kommentar von Cscommander ,

Sinussätze sind doppelt, weil damit der jede Angabe verarbeiten kann. Bei den Sinussätzen gibt es insgesamt mehr Möglichkeiten falls du das meintest.

Kommentar von Minilexikon ,

Ah, okay. Ich vertraue da mal auf deine Aussage :D

Deckt du damit alle erdenklichen Möglichkeiten ab?

Kommentar von Minilexikon ,

Jetzt mal zur to do-Liste:



// Inputs als Variable speichern
var winkelAlpha = document.querySelector("#winkel1");
var winkelBeta = document.querySelector("#winkel2");
var winkelGamma = document.querySelector("#winkel3");
var seiteA = document.querySelector("#seite1");
var seiteB = document.querySelector("#seite2");
var seiteC = document.querySelector("#seite3");

das hier machen:

// Inputs als Variable speichern
var winkelAlpha = $("#winkel1").val();
var winkelBeta = $("#winkel2").val();
var winkelGamma = $("#winkel3").val();
var seiteA = $("#seite1").val();
var seiteB = $("#seite2").val();
var seiteC = $("#seite3").val();

und sparst dir an vielen Stellen

if(seiteB.value != "" && seiteC.value != "" && winkelAlpha.value != ""){
//... }

was zu

if(!isEmpty(seiteB,seiteC,winkelAlpha)){
//...
}

wird.

Kommentar von Cscommander ,

danke, ich werde mich dran machen!

Kommentar von Minilexikon ,

Super. Viel Spaß :)

Kommentar von Minilexikon ,

Als nächstes anstehen könnte:

  • Input/Output strukturieren:
triangle = {

angles : {
alpha: parseInt($('#winkel1').val()) || 0,
beta: parseInt($('#winkel2').val()) || 0,
gamma: parseInt($('#winkel3').val()) || 0
},
sides: {
A: parseInt($('#seite1').val()) || 0,
B: parseInt($('#seite2').val()) || 0,
C: parseInt($('#seite3').val()) || 0
}
}
  • Inputvalidierung

HTML

statt

<input type="text" id="seite1" class="seite" placeholder="A">

input type="number":

<input type="number" id="seite1" class="seite" placeholder="A" />

Bei den Seiten und Winkeln kannst du noch ein paar weitere Dinge begrenzen:

<input type="number" id="winkel1" class="winkel" placeholder="&alpha;" min="0" max="360" />

Javascript/jQuery:

statt

var winkelAlpha = document.querySelector("#winkel1");

als Zahl formatieren und standardmäßig auf Null setzen

var A = parseInt($('#seite1').val()) || 0;
Kommentar von Minilexikon ,

So, ich habe deinen Code mal ein bisschen aufgeräumt: http://codepen.io/Minilexikon/pen/pEQwQk?editors=0010#0

Kommentar von Cscommander ,

Danke schonmal für deine Hilfe !

Kommentar von Minilexikon ,

Sehr gerne. War bis jetzt ja nur code cleaning ;)

Antwort
von triopasi, 52

Du kannst, genau wie du aus den Feldern liest auch in die Felder schreiben... Da kannste n Feld für's Ergebnis machen und das Resultat da einfach reinschreiben.

Kommentar von Cscommander ,

Es geht halt eher darum, dass wenn das Ergebnis ausgerechnet wird direkt wieder in den Input kommt. Und dass das auch automatisiert funktioniert. Bin noch ein Anfänger...

Kommentar von triopasi ,

Was meinste mit "wenn das Ergebnis ausgerechnet wird direkt wieder in den Input kommt."?

Kommentar von Cscommander ,

Also wenn man mit dem Rechner ein Ergebnis ausrechnet meinetwegen a erscheint das Ergebnis in der Konsole wegen console.log(a). Aber ich möchte dieses Ergebnis dann in den Feldern stehen haben, wo man die normalen Angaben einträgt...

Kommentar von triopasi ,

Wie gesagt: Du kannst in Felder schreiben, genau so wie du aus ihnen liest. Wo ist das KONKRETE Problem?

Keine passende Antwort gefunden?

Fragen Sie die Community