finding total amount of an html table in javascript per row

Crowded Caribou answered on September 5, 2022 Popularity 4/10 Helpfulness 1/10

answer finding total amount of an html table in javascript per row

finding total amount of an html table in javascript per row

Comment

var entryButton = document.getElementById('inputButton')
const tbodyEl = document.querySelector("tbody");
var row = 1;

//click button event
entryButton.addEventListener('click', tableDisplay);

//input value and displaying information
function tableDisplay(e) {
  e.preventDefault()
  var name = document.getElementById('inputName').value;
  var amount = document.getElementById('inputAmount').value;
  var date = document.getElementById('inputDate').value;
  var remarks = document.getElementById('inputRemarks').value;
  
  document.getElementById('inputName').value = '';
  document.getElementById('inputAmount').value = '';
  document.getElementById('inputDate').value = '';
  document.getElementById('inputRemarks').value = '';
  
  if (!name || !amount || !date || !remarks) {
    alert("Please fill all the blanks")
    return;
  }

  name.value = " ";
  amount.value = " ";
  date.value = " ";
  remarks.value = " ";
  
  var table = document.getElementById('displayTable');

  var newRow = table.insertRow(row);

  var cell1 = newRow.insertCell(0);
  var cell2 = newRow.insertCell(1);
  var cell3 = newRow.insertCell(2);
  var cell4 = newRow.insertCell(3);

  cell1.innerHTML = name
  cell2.innerHTML = date
  cell3.innerHTML = amount
  cell4.innerHTML = remarks
  
  total()


  row++;
}

function total(){
    var table = document.getElementById('displayTable');
    let total = 0
    for(let i = 1; i<table.rows.length; i++){
        total+=Number(table.rows[i].cells[2].innerText)
    }
    const totalInput = document.getElementById('total')
    totalInput.value=total

}

Popularity 4/10 Helpfulness 1/10 Language javascript

Source: stackoverflow.com

Tags: html-table javascript row

Link to this answer
Share Copy Link

Contributed on Sep 05 2022

Crowded Caribou

0 Answers Avg Quality 2/10

finding total amount of an html table in javascript per row

Contents

More Related Answers

finding total amount of an html table in javascript per row

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.