Take the value of a cell in a table

0

Hello friends I am new in this I am creating an application to generate sales and I would like your help I want to take the returned values for quantity and products to get the total I hope you can help me greetings.

@using DP_Prueba.Models
@model List<ProductosModels>

@{
    ViewBag.Title = "Inicia Venta";
}



<h1 style="text-align:center;">Inicia Venta</h1>
<h2 style="text-align:center;">¿Que Productos registrara para venta?</h2>

    <br />

<div class="form-group">
    Producto:
    <select id="Producto" class="form-control" onkeyup="Suma()" required>
        <optgroup label="Productos">
            @foreach (var i in Model)
            {
                <option>@i.Nombre</option>
            }
        </optgroup>
    </select>
    <br />
    Cantidad:
    <input class="form-control" id="Cantidad" min="1" style="margin:4px" type=number placeholder="Ingresa Cantidad" onkeyup="Suma()" required>
    <br />
    Precio:
    <select id="Precio" class="form-control" onkeyup="Suma()" required>
        <optgroup label="Precio">
            @foreach (var i in Model)
            {
                <option>@i.Precio</option>
            }
        </optgroup>
    </select>
    <br />
    <button id="Eliminar" class="btn btn-success" id="btn_guardar" onclick="Guardar(),Total()">Agregar a lista.</button><br><br>
    <br />
</div>


    <table class="table table-bordered" id="tablaEliminar">
        <thead>
            <tr>
                <th>Producto</th>
                <th>Cantidad</th>
                <th>Precio</th>
                <th>Eliminar</th>
            </tr>
        </thead>


        <tbody id="tabla"></tbody>
    </table>


    Total: <input type="text" id="total" disabled value="0">
    <button class="btn btn-success" onclick="Aceptar(),location='/Vendedor/VentaTotal'">Aceptar</button>


    <button class="btn btn-danger" onclick="Cancelar(),location='/Vendedor/Index'">Cancelar </button>
    <script>
        function Guardar() {

            var producto = document.getElementById("Producto").value;
            var cantidad = document.getElementById("Cantidad").value;
            var precio = document.getElementById("Precio").value;
            var eliminar = document.getElementById("Eliminar").value;

            var fila = "<tr><td>" + producto + "</td><td>" + cantidad + "</td><td>" + precio + "</td><td><button value=Eliminar onclick=deleteRow(this)></button>" + eliminar;

            var btn = document.createElement("TR");
            btn.innerHTML = fila;
            document.getElementById("tabla").appendChild(btn);
        }

        function Cancelar() {
            alert("Venta cancelada regresando a menú principal.");
        }
        function Aceptar() {
            alert("Procesando venta.")
        }
        function deleteRow(r) {
            var i = r.parentNode.parentNode.rowIndex;
            document.getElementById("tablaEliminar").deleteRow(i);
        }
    </script>

    <script type="text/javascript">
        function Suma() {
            //var valor1 = verificar("Cantidad");
            //var valor2 = verificar("Precio");
            var valor3 = verificar("tabla");
            var valor4 = verificar("tabla");

            document.getElementById("total").value = parseFloat(valor3) * parseFloat(valor4) ;
        }

        function verificar(id) {
            var obj = document.getElementById(id);
            if (obj.value == "")
                value = "0";
            else
                value = obj.value;
            if (validate_importe(value, 1)) {
                // marcamos como erroneo
                obj.style.borderColor = "#808080";
                return value;
            } else {
                // marcamos como erroneo
                obj.style.borderColor = "#f00";
                return 0;
            }
        }

        function validate_importe(value, decimal) {
            if (decimal == undefined)
                decimal = 0;

            if (decimal == 1) {
                // Permite decimales tanto por . como por ,
                var patron = new RegExp("^[0-9]+((,|\.)[0-9]{1,2})?$");
            } else {
                // Numero entero normal
                var patron = new RegExp("^([0-9])*$")
            }

            if (value && value.search(patron) == 0) {
                return true;
            }
            return false;
        }
    </script>
    
asked by Lalo 06.12.2017 в 05:26
source

1 answer

0

You do not tell us what does not work for you, but of course, the options of your select must have a value attribute, not just the text.

Instead of

<option>@i.Nombre</option>

It should be

<option value="@i.Nombre" >@i.Nombre</option>

(I do not know the syntax of the framework you are using ... maybe value is not in quotation marks)

A working minimum example would be:

function comprueba() {
  var producto=document.getElementById('producto').value,
      cantidad=document.getElementById('cantidad').value;
      
  console.log('Se ha elegido ',cantidad,' elementos del producto ', producto);
}
<select id="producto">
  <option value="gorra">gorra</option>
  <option value="zapato">zapato</option>
  <option value="pantalon">pantalón</option>
</select>

<input type="number" id="cantidad" value="0">

<button onclick="comprueba()">Comprobar</button>
    
answered by 06.12.2017 в 11:55