Lo que quiero hacer es calcular los valores del campo SubTotal, siendo que este es el resultado de la multiplicación entre los valores del campo Precio y el valor ingresado en field text Cantidad. Ademas de calcular el IGV de la suma de los Subtotales y el Total(Suma de los Subtotales y el IGV)
Soy nuevo con JS y no conozco mucho del lenguaje.
JS:
$('.a').on('click',function(){
var trPrincipal = this.offsetParent.parentElement; //Buscamos el TR principal
// var firstName = trPrincipal.children[0].outerText; //Capturamos el FirstName
var idproducto=trPrincipal.children[0].outerText;
var nombreprod=trPrincipal.children[1].outerText;
var peso=trPrincipal.children[3].outerText+' '+trPrincipal.children[2].outerText;
var precio=trPrincipal.children[5].outerText;
// var lastName = trPrincipal.children[1].outerText+' '+trPrincipal.children[2].outerText; //Capturamos el LastName
$(".othertable").append("<tr><td>"+
idproducto+"</td><td>"+
nombreprod
+"</td><td>"+
peso+"</td><td>"+
precio+"<td><input type='text' placeholder='Ingresar cantidad'/></td><td><input type='text' disabled value='458.15'></td><td><input type='button' class='btneli' id='idbotoneli' value='Eliminar'></td></tr>");
trPrincipal.style.display = "none"; //Ocultamos el TR de la Primer Tabla
var btn_ = document.querySelectorAll(".btneli"); // Buscamos todos los elementos que tengan la clase .btneli
for(var a in btn_){ //Iteramos la variable btn_
var b = btn_[a];
if(typeof b == "object"){ //Solo necesitamos los objetos
b.onclick = function (){ //Asignamos evento click
var trBtn = this.offsetParent.parentElement; // buscamos el tr principal de la segunda tabla
var firstNameBtn = trBtn.children[0].outerText; //Capturamos el FirstName de la segunda tabla
trBtn.remove(); // eliminamos toda la fila de la segunda tabla
var tbl = document.querySelectorAll(".table td:first-child"); //Obtenemos todos los primeros elementos td de la primera tabla
for(var x in tbl){ //Iteramos los elementos obtenidos
var y = tbl[x];
if(typeof y == "object"){ //solo nos interesan los object
if (y.outerText == firstNameBtn){ //comparamos el texto de la variable y vs el firstNameBtn
var t = y.parentElement; //capturamos el elemento de la coincidencia
t.style.display = ""; //actualizamos el estilo display dejándolo en vacío y esto mostrará nuevamente la fila tr de la primera tabla
}
}
}
}
}
}
});
table{
margin:20px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<div class="container">
<table id="idsecond" class="table table-bordered table-hover">
<thead bgcolor="skyblue">
<tr>
<th>#</th>
<th>Articulo</th>
<th>Unidad M.</th>
<th>Peso/Volumen</th>
<th>Categoria</th>
<th>P.Unitario</th>
<th>Accion</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Arroz</td>
<td>Kilo</td>
<td>4</td>
<td>---</td>
<td>18</td>
<td><button class="a">Agregar</button></td>
</tr>
<tr>
<td>2</td>
<td>Sal</td>
<td>Kilo </td>
<td>2</td>
<td>---</td>
<td>14</td>
<td><button class="a">Agregar</button></td>
</tr>
<tr>
<td>3</td>
<td>Maiz</td>
<td>Kilo</td>
<td>3</td>
<td>---</td>
<td>12</td>
<td><button class="a">Agregar</button></td>
</tr>
</tbody>
</table>
<table class="othertable col-xs-12 table-condensed table-hover table-bordered">
<thead bgcolor="orange">
<tr>
<th>#</th>
<th>Nombre</th>
<th>Peso/Volumen</th>
<th>Precio</th>
<th>Cantidad</th>
<th>SubTotal</th>
<th>Accion</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<hr>
<div class="row">
<div class="form-group col-sm-4">
<label for="igv">IGV:</label>
<input type="text" class="form-control"disabled id="igv">
</div>
<div class="form-group col-sm-4">
<label for="total">Total:</label>
<input type="text" class="form-control" disabled id="total">
</div>
</div>
</div>