I am making a table in html where I have to calculate a price after discount.
I have for the moment 2 rows with 7 header cells and under each header cell I have a cell. I am struggling to add values to my cells. I tried this var cells = document.getElementById('table').getElementsByTagName('td');
cells[1] = "3";
to add the value 3 to my Quantity but the value does not appear on my table. I want to do it this way so I can later apply the convert function to all my Tds.
What am I doing wrong?
/* Format amount */
function ConvertAmount(Amount) {
var cells = document.getElementById('table').getElementsByTagName('td');
cells[1] = "3";
var Zahl = Amount;
Zahl = Math.round(Zahl * Math.pow(10, 2)) / Math.pow(10, 2);
Zahl = Zahl.toFixed(2);
Zahl = Zahl.toString();
var Negativ = false;
if (Zahl.indexOf("-") == 0) {
Negativ = true;
Zahl = Zahl.replace("-", "");
}
var str = Zahl.toString();
str = str.replace(".", ",");
var intVorkommastellen = str.length - (str.length - str.indexOf(","));
var intKTrenner = Math.floor((intVorkommastellen - 1) / 3);
var intZiffern = (intVorkommastellen % 3 == 0) ? 3 : (intVorkommastellen % 3);
strNew = str.substring(0, intZiffern);
strHelp = str.substr(intZiffern, (str.length - intZiffern));
for (var i = 0; i < intKTrenner; i++) {
strNew += "." + strHelp.substring(0, 3);
strHelp = strHelp.substr(intZiffern, (strHelp.length - intZiffern));
}
var szNachkommastellen = str.substring(intVorkommastellen, str.length);
if (szNachkommastellen.length < 3) {
strNew += str.substring(intVorkommastellen, str.length) + '0';
} else {
strNew += str.substring(intVorkommastellen, str.length);
}
var Zahl = strNew;
if (Negativ) {
Zahl = "- " + Zahl;
}
return Zahl;
}
.briefkopf {
margin-top: 5px;
}
.ueberschrift {
font-size: 20pt;
font-weight: bolder;
}
.unterueberschrift {
font-size: 14pt;
}
.dagufarbe {
color: #EC7404;
}
body {
margin: 0;
padding: 0;
font: 12pt"Arial";
}
.page {
width: 21cm;
min-height: 29.7cm;
padding: 1cm;
margin-left: 50px;
}
.subpage {
padding: 1cm;
border: 5px red solid;
height: 256mm;
outline: 2cm #FFEAEA solid;
page-break-before: always;
page-break-after: always;
}
@page {
size: A4;
margin: 0;
}
@media print {
.page {
margin: 0;
border: initial;
border-radius: initial;
width: initial;
min-height: initial;
box-shadow: initial;
background: initial;
page-break-after: always;
}
}
<div class="page">
<div class="briefkopf">
<br>
<br>
<br>
<div>
<script type="text/javascript">
</script>
</div>
<div>street</div>
<div>number</div>
<div>country</div>
</div>
<br>
<br>
<div class="ueberschrift">Offer from
<script type="text/javascript">
document.write(Invoicedate)
</script>
</div>
<br>
<style type="text/css">
.tg {
border-collapse: collapse;
border-spacing: 0;
}
.tg td {
font-family: Arial, sans-serif;
font-size: 12pt;
padding: 10px 5px;
border-width: 1px;
border-style: none none solid;
}
.tg th {
font-family: Arial, sans-serif;
font-size: 12pt;
font-weight: normal;
padding: 10px 5px;
border-width: 3px;
border-style: none none solid;
}
</style>
<table id="table" class="tg" style="width:900px;">
<tr>
<th align="center" class="tg">Pos</th>
<th id="Quantity" align="center" class="tg">Quantity</th>
<th align="center" class="tg">Type</th>
<th align="left" class="tg">Description</th>
<th align="center" class="tg" style="width:100px;">Unitprice</th>
<th align="center" class="tg" style="width:75px;">Discount</th>
<th align="center" class="tg">Totalprice</th>
</tr>
<tr style="page-break-inside:avoid;">
<td align="right" class="tg" valign="top">
<center>
<script type="text/javascript">
document.write(ConvertAmount('{{POSITION}}'))
</script>
</center>
</td>
<td align="right" class="tg" valign="top">
<center>
<script type="text/javascript">
document.write(ConvertAmount('{{QUANTITY}}'))
</script>
</center>
</td>
<td align="right" class="tg" valign="top">
<center>
<script type="text/javascript">
document.write(ConvertAmount('{{ART}}'))
</script>
</center>
</td>
<td align="left" class="tg">
<div class="dagufarbe">
<center>
<script type="text/javascript">
document.write(ConvertAmount('{{DESCRIPTION}}'))
</script>
</center>
</div>
<br>
<div style="margin-top:-15px;">
<script type="text/javascript">
document.write(ConvertAmount('{{COMMENTARY}}'))
</script>
</div>
</td>
<td align="right" class="tg" valign="top">
<script type="text/javascript">
document.write(ConvertAmount('{{UNITPRICE}}'))
</script>€</td>
<td align="right" class="tg" valign="top">
<script type="text/javascript">
document.write(ConvertAmount('{{DISCOUNT}}'))
</script>%</td>
<td align="right" class="tg" valign="top">
<script type="text/javascript">
document.write(ConvertAmount('{{POSITIONSPRICE}}'))
</script>€</td>
</tr>
</table>
<style type="text/css">
.ta {
font-family: Arial, sans-serif;
font-size: 12pt;
padding: 10px 5px;
overflow: hidden;
word-break: normal;
}
.tb {
font-family: Arial, sans-serif;
font-size: 12pt;
font-weight: normal;
padding: 10px 5px;
border-width: 3px;
border-style: none none solid;
}
.te {
font-family: Arial, sans-serif;
font-size: 12pt;
font-weight: normal;
padding: 10px 5px;
border-style: none none solid;
}
</style>
<table style="width:575px; margin-left:330px;">
<tr>
<td class="ta">Total nett
<div style="margin-left:500px; margin-top:-20px;">
<script type="text/javascript">
document.write(ConvertAmount('{{AMOUNTNETT}}'))
</script>€</div>
<br>
</td>
</tr>
<tr>
<td class="te">
<div style="margin-top:-25px;">plus VAT 19,00 %</div>
<div style="margin-left:500px; margin-top:-20px;">
<script type="text/javascript">
document.write(ConvertAmount('{{AMOUNTTAX}}'))
</script>€</div>
<br>
</td>
</tr>
<tr>
<td class="tb"><b>Total amount <div style="margin-left:500px; margin-top:-20px;"><script type="text/javascript">document.write(ConvertAmount('{{AMOUNTGROSS}}'))</script> €</div></b>
</td>
</tr>
</table>
<br>
</div>
<br>
</p>