Anzeige Problem in Formularen
Apo2k7
- html
Hallo,
Ich habe ein Problem das wie ich vermute auf Kommunikationsprobleme zwischen Javascript und Html5 zurück zu führen ist. Ich habe als Startseite eine kleine Webseite geschrieben die den BMI eines Patienten berechnen soll (für weitere Berechnung auf noch folgenden Seiten tut nicht viel zur Sache). Die nötigen Informationen werden über Formulare eingelesen und dann in Javascript ausgewertet und der BMI berechnet. Anschießend soll das Ergebnis in einem weiteren Formular das "disabled" würde ausgegeben werden. Nun zu meinem Problem: sobald man die eingaben aus den Formularen absendet und der BMI in Javascript berechnet wird werden sämtliche eingaben aus den Formularen gelöscht, genauso auch aus dem Ergebnis Formular (Das Ergebnis leuchtet Kurz auf verschwindet aber sofort wieder).
Ich hätte es lieber wenn die Eingaben sowie das Ergebnis dort erhalten bleiben bis man zum nächsten Rechenschritt weiter geht.
Ich hoffe jemand hier im Forum hat da eine Idee wie das zustande kommt oder sogar eine Lösung wie ich dieses Problem umgehen kann.
MfG
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<title>Get your patients BMI</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/normalize.min.css" type="text/css">
<link rel="stylesheet" href="css/main.css" type="text/css">
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<!--[if lt IE 7]>
<p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
<![endif]-->
<div class="header-container">
<header class="wrapper clearfix">
<h1 class="title">-</h1>
</header>
</div>
<div class="main-container">
<div class="main wrapper clearfix">
<article id="bla">
<header>
<h1>Step1 getting the BMI of the patient</h1>
<p>Enter the weight of the patient bevor pregnancy (in kg) and the height of the patient (in cm) to determine the BMI of the patient</p>
</header>
<section> <!--Eingabefelder für gewicht und größe-->
<form name="WeightHeight" id="Input 1" >
<p>Weight of patient before pregnancy (in kg): </p>
<input maxlength="3" name="weight" type="number" id="weight1">
<p>Height of patient (in cm):</p>
<input maxlength="3" name="height" type="number" id="height">
<h2 id="H2">Get your BMI</h2>
<button id="getBMI" name="button1" type="Submit">Submit</button>
<p>Your BMI</p>
<input id="BMI" name="BMI" disabled="disabled" value="">
<form action="/Normal Weight/Step2Normal.html">
<p>Move forward</p>
<button id="nextStep" name="nextStep" type="Submit">Next step</button>
</form>
<script>
$(getBMI).on('click', function(){
var weight = $("input:first").val();
var height = $("input:eq(1)").val();
var bmi = (weight/([height/100]*[height/100]));
document.cookie = bmi;
if (bmi >= 18.5 && bmi < 25){ /* normal weight */
document.getElementsByName("BMI")[0].value=bmi.toFixed(1) + "normal weight";
}
else if (bmi >= 25 && bmi < 30){ /* overweight */
document.getElementsByName("BMI")[0].value=bmi.toFixed(1) + "overweight";
}
else if (bmi > 30){ /* obssesivweight */
document.getElementsByName("BMI")[0].value=bmi.toFixed(1) + "obssesivweight";
}
else{ /* alles andere */
window.alert(undefined)
}
});
</script>
</form>
</section>
</article>
</div> <!-- #main -->
</div> <!-- #main-container -->
<div class="footer-container" id="footer">
<footer class="wrapper">
<h3>Get your patients BMI</h3>
</footer>
</div>
</body>
</html>
Hi,
Nun zu meinem Problem: sobald man die eingaben aus den Formularen absendet und der BMI in Javascript berechnet wird werden sämtliche eingaben aus den Formularen gelöscht, genauso auch aus dem Ergebnis Formular (Das Ergebnis leuchtet Kurz auf verschwindet aber sofort wieder).
Das ist normal, wenn das Formular tatsächlich an den Server geschickt wird, anstatt clientseitig verarbeitet zu werden.
<h2 id="H2">Get your BMI</h2>
<button id="getBMI" name="button1" type="Submit">Submit</button>
Submit-Button - schickt natürlich das Formular ab.
$(getBMI).on('click', function(){
Wo hast du die Variable getBMI deklariert?
MfG ChrisB
Danke für die schnelle Antwort.
na gut es ist vielleicht zu verkraften das die Eingabeformulare dann nichts mehr anzeigen die kann ich ja Theoretisch dann auch ausblenden (sieht vermutlich sogar besser aus) aber wieso verschwindet mein Ergebnis auch im Ausgabeformular?
getBMI ist keine Variable das ist in JQuery die Form des Aufrufens von id's so kann ich die id von dem Button ansprechen und die jeweilige Funktion deklarieren.
Und ich schiebe gleich noch mal eine Frage hinterher weils grad so schön ist... ich habe ja in Javascript die 3 if- abfragen. Gibt es da eine möglichkeit den link Button jeweils mit einem anderem Link zu bestücken um dann auf die nächste Seite zu kommen ist leider nötig da die Berechnungen sie ändern je nach Ergebnis.
MfG
Hallo,
Danke für die schnelle Antwort.
na gut es ist vielleicht zu verkraften das die Eingabeformulare dann nichts mehr anzeigen die kann ich ja Theoretisch dann auch ausblenden (sieht vermutlich sogar besser aus) aber wieso verschwindet mein Ergebnis auch im Ausgabeformular?
du schickst das Formular ab (die Seite wird neu geladen) unterbinde das Absenden und schon bleiben deine Daten da. Entweder deine Funktion gibt ein false zurück oder du änderst den submit button in einem ganz normalen button (letzteres wäre die von mir bevorzugte Variante).
Und ich schiebe gleich noch mal eine Frage hinterher weils grad so schön ist... ich habe ja in Javascript die 3 if- abfragen. Gibt es da eine möglichkeit den link Button jeweils mit einem anderem Link zu bestücken um dann auf die nächste Seite zu kommen ist leider nötig da die Berechnungen sie ändern je nach Ergebnis.
wenn du in einem der 3 Zweige drin bist, kannst du ja die action deines zweiten Formulares mit JavaScript entsprechend manipulieren.
martachen
Super genial,
Vielen dank, hätte man auch irgendwie drauf kommen können aber ich glaub ich werd so langsam matschig sitze seit 10 Stunden davor und kam nicht auf die Lösung...