I'm using innerhtmal for output but the problem is it shows 1 less value the array I cant find the problem.
await fetch(urlbody, bodyrequestOptions)
.then((response) => response.json())
.then((payload) => {
console.log(payload)
payload.map(({
TRANS_NO,
TRANS_DATE,
DR_AMT,
CR_AMT,
PARTICULAR
}, index) => {
/* Calculatation*/
oprningbalance += CR_AMT
oprningbalance -= DR_AMT
document.getElementById('output2').innerHTML += `<tr>
<td>${index + 1}</td>
<td class="text-tiny text-break">${moment(TRANS_DATE).format('LLL')}</td>
<td class="text-tiny">${TRANS_NO}</td>
<td class="text-tiny">${DR_AMT.toFixed(2)}</td>
<td class="text-tiny">${CR_AMT.toFixed(2)}</td>
<td class="text-tiny">${oprningbalance.toFixed(2)}</td>
<td class="text-tiny text-break">${PARTICULAR}</td>
</tr>`
total_dr += DR_AMT
total_cr += CR_AMT
})
Try this instead
document.getElementById('output2').innerHTML = payload.map(({TRANS_NO,TRANS_DATE,DR_AMT,CR_AMT,PARTICULAR}, index) => {
/* Calculatation*/
oprningbalance += CR_AMT
oprningbalance -= DR_AMT
total_dr += DR_AMT
total_cr += CR_AMT
return `<tr>
<td>${index + 1}</td>
<td class="text-tiny text-break">${moment(TRANS_DATE).format('LLL')}</td>
<td class="text-tiny">${TRANS_NO}</td>
<td class="text-tiny">${DR_AMT.toFixed(2)}</td>
<td class="text-tiny">${CR_AMT.toFixed(2)}</td>
<td class="text-tiny">${oprningbalance.toFixed(2)}</td>
<td class="text-tiny text-break">${PARTICULAR}</td>
</tr>`
}).join("")