Hallo zusammen!
Bei meinem Programm werden vom User in ein Formular gewisse Werte eingetragen. Diese sollen dann
in einer Tabelle unterhalb des Formulars eingefügt werden, was auch soweit funktioniert.
Jedoch sollte auch einmal die Gesamtsumme von den Kalorien und den Trainingsdauer gemacht werden, womit ich aber meine Probleme habe
Anstatt das die Gesamtsumme der Kalorien berechne wird zB einfach für jeden neu erstellten Eintrag, ein Eintrag in der selben Zelle gemacht. Jedoch nichts addiert und auch nicht überschrieben.
Meine Zeile für die Gesamtsumme lautet: document.getElementById('kalor').innerHTML = document.getElementById('kalor').innerHTML + kalo;
Kann mir bitte jemand helfen wie ich das syntaktisch richtig formuliere?
Bei meinem Programm werden vom User in ein Formular gewisse Werte eingetragen. Diese sollen dann
in einer Tabelle unterhalb des Formulars eingefügt werden, was auch soweit funktioniert.
Jedoch sollte auch einmal die Gesamtsumme von den Kalorien und den Trainingsdauer gemacht werden, womit ich aber meine Probleme habe
Anstatt das die Gesamtsumme der Kalorien berechne wird zB einfach für jeden neu erstellten Eintrag, ein Eintrag in der selben Zelle gemacht. Jedoch nichts addiert und auch nicht überschrieben.
Meine Zeile für die Gesamtsumme lautet: document.getElementById('kalor').innerHTML = document.getElementById('kalor').innerHTML + kalo;
Kann mir bitte jemand helfen wie ich das syntaktisch richtig formuliere?
HTML:
<form name="form1" id="form_id" action="" onsubmit="return false;">
<div class="input-group">
<span class="input-group-addon" id="ubung1">Übung</span>
<input type="text" class="form-control" placeholder="Name der Übung" aria-describedby="einfaches-addon1" required>
</div>
<div class="input-group">
<span class="input-group-addon" id="kalo" aria-hidden="true">Verbrannte Kalorien [cal]</span>
<input type="number" class="form-control" placeholder="Verbrannte Kalorien [cal] (Wert innerhalb von 1-2500)" aria-describedby="einfaches-addon1" required>
</div>
<div class="input-group">
<span class="input-group-addon" id="time0" aria-hidden="true">Beginn Datum/Zeit</span>
<input type="datetime-local" class="form-control" placeholder="Beginn Datum/Zeit" aria-describedby="einfaches-addon1" required>
</div>
<div class="input-group">
<span class="input-group-addon" id="time1" aria-hidden="true">Ende Datum/Zeit</span>
<input type="datetime-local" class="form-control" placeholder="Ende Datum/Zeit" aria-describedby="einfaches-addon1" required>
</div>
<input type="reset" value="Zurücksetzen"/>
<input type="submit" value="Update!" onClick="updateTable();return false;"/>
</form>
<p>
<table border='1'>
<thead><tr><th>Übung</th><th>Verbrannte Kalorien [cal]</th><th>Beginn Datum/Zeit</th><th>Ende Datum/Zeit</th><th>Trainingsdauer [min]</th></tr></thead>
<tbody id="editable"></tbody>
</table>
</p>
<p>
<table border='1'>
<thead><tr><th>Gesamtsumme Kalorien</th><th>Gesamtdauer Training</th></thead>
<tbody id="table2">
<tr>
<td id="kalor" width='160'><center><input type='text' name='feld1' value=0></center></td>
<td width='160'><center><input type='text' name='feld2' value=0 ></center></td>
</tr>
</tbody>
</table>
</p>
Code:
function updateTable(){
var tabBody, row, cell, x, y, kalo;
tabBody=document.getElementById("editable");
row=document.createElement("tr");
cell = document.createElement("td");
cell.innerHTML=document.forms['form1'].elements[0].value;
row.appendChild(cell);
cell = document.createElement("td");
if (kalo_is_valid(document.forms['form1'].elements[1].value)){
kalo=document.forms['form1'].elements[1].value
cell.innerHTML=kalo;
}
row.appendChild(cell);
cell = document.createElement("td");
cell.innerHTML=document.forms['form1'].elements[2].value;
x = new Date(document.forms['form1'].elements[2].value);
row.appendChild(cell);
cell = document.createElement("td");
cell.innerHTML=document.forms['form1'].elements[3].value;
y = new Date(document.forms['form1'].elements[3].value);
row.appendChild(cell);
cell = document.createElement("td");
if (date_is_valid(x,y)){
cell.innerHTML= (y - x) /1000/60;
}
row.appendChild(cell);
tabBody.appendChild(row);
document.getElementById('kalor').innerHTML = document.getElementById('kalor').innerHTML + kalo;
}
Zuletzt bearbeitet: