Блог

У меня возникли проблемы с умножением цены и количества и вычислением выходных данных внутри входных данных в моем проекте asp .net mvc. Кажется, я получаю только первую строку таблицы для этого, а остальные, которые следуют, ничего не отображают. Как вы можете видеть, я добавляю таблицу и ее содержимое с помощью javascript. Пожалуйста, найдите способ сделать это для оставшихся строк. Функция, которая выполняет вычисления, — это multiply() в глубине, остальное я вставил для вашего удобства.

Вот мой javascript:

 <script>
var date = document.getElementById('second');
date.setAttribute('type', 'date');
var inp = document.getElementById('last');
inp.addEventListener('keyup', function (event) {
    if (event.keyCode === 13) {
        addRow();
        event.preventDefault();
        document.getElementById("addRow").click();
    }
});
var box = document.getElementById('second');
box.addEventListener('keyup', function (event) {
    if (event.keyCode === 13) {
        addRow();
        event.preventDefault();
        document.getElementById("addRow").click();
    }
});

function addRow() {
    var empTab = document.getElementById('empTable');
    var rowCnt = empTab.rows.length;   // table row count.
    var tr = empTab.insertRow(rowCnt); // the table row.
    tr = empTab.insertRow(rowCnt);
    // as you can see there are 5 rows

    for (var c = 0; c < 5; c  ) {
        var td = document.createElement('td'); // table definition.
        td = tr.insertCell(c);
        if (c == 0) {
            var html = '<button type="button" class="btn btn-flat btn-danger" onclick="deleteRow(this)"><i class="fa fa-trash"></i></button>'
            td.innerHTML = html;
        }
        else if (c == 1) {
            var htnl = '<select class="form-control"><option>dead</option><option>byr</option></select>'
            td.innerHTML = htnl;
        }
        else if (c == 2) {
            var qty = document.createElement('input');
            qty.className = "form-control";
            qty.setAttribute('type', 'text');
            qty.setAttribute('id', 'qty');
            qty.setAttribute('onkeypress', 'javascript: if(event.keyCode === 13) addRow(this);');
            qty.setAttribute('oninput', 'multiply(this)');
            td.appendChild(qty);
        }
        else if (c == 3) {
            var rate = document.createElement('input');
            rate.className = "form-control";
            rate.setAttribute('type', 'text');
            rate.setAttribute('id', 'rate');
            rate.setAttribute('onkeypress', 'javascript: if(event.keyCode === 13) addRow(this);');
            rate.setAttribute('oninput', 'multiply(this)');
            td.appendChild(rate);
        }
        else if (c == 4) {
            var total = document.createElement('input');
            total.className = "form-control";
            total.setAttribute('type', 'text');
            total.disabled = false;
            total.setAttribute('id', 'total');
            total.setAttribute('onkeypress', 'javascript: if(event.keyCode === 13) addRow(this);');
            td.appendChild(total);
        }
    }
}
function multiply() {
        var inpTotal = document.getElementById('qty').value || 0;
        var inpRate = document.getElementById('rate').value || 0;
        var product = parseFloat(inpTotal) * parseFloat(inpRate);
        document.getElementById('total').value = product;
        return (product);
}

// delete TABLE row function.
function removeRow(oButton) {
    var empTab = document.getElementById('empTable');
    empTab.deleteRow(oButton.parentNode.parentNode.rowIndex); // button -> td -> tr.
}

// function to extract and submit table data.