0

Estoy haciendo la edición de un pedido, y este va por filas. Tengo 5 columnas en la vista:

1)Producto -> es un select, donde cargo los productos de la BD
2)Opcion -> este es otro select que tiene que ser dependiente del primero
3)Precio -> depende la opción que elijan se tiene que llenar con el precio

Vale muestro lo que tengo en la vista:

@php $contador =1 @endphp
   @foreach ($pedidos as $key => $ped)
     <tr data-fila="{{ $contador }}" id="InputsWrapper">
       <td>
         <select class="form-control selectSTer js-example-basic-single selectProductos idProducto" name="eProducto[]" style="min-height: 38px;">
            <option value="" selected>Selecciona un producto </option>
               @foreach ($productos as $pro)
                  <option value="{{ $pro->id}}" {{ ( $pro->id== $ped->idProducto) ? 'selected' : '' }}> {{ $pro->name }} </option>
               @endforeach
          </select>
        </td>
        <td>
        <select class="form-control selectSTer js-example-basic-single" name="eTipo[]" style="min-height: 38px;">
          <option value="">Selecciona una opción </option>
              @foreach ($numPedido2 as $item)
                <option value="{{ $item->idCombias}}" {{ ( $item->idCombias== $ped->idCombi) ? 'selected' : '' }}> {{ $item->combination }} </option>
              @endforeach   
         </select>
         </td>
         <td><input type="text" class="form-control selectTercero inputcalculo  ePrecioUnid" name="ePrecioUnid[]" value="{{number_format($ped->precio, 2)}}" autocomplete="off"></td>
         <td style="width: 30px;"><input type="text" class="form-control selectTercero inputcalculo cntComprada" name="cntComprada[]" value="{{ $ped->cantidad }}" autocomplete="off"></td>
         <td><input type="text" class="form-control selectTercero inputcalculo eSubTotal" name="eSubTotal[]" value="{{number_format($ped->subtotal, 2)}}" autocomplete="off"></td>
         <td><a href="#"><i class="far fa-trash-alt iconTask"></i></a></td>
       </tr>
   @php $contador= $contador + 1; @endphp
@endforeach

Luego tengo un botón para añadir fila al pedido:

<div class="pull-right" style="margin-top: 1%;">
    <a href="#" id="add" class="aFila" ><i class="icon-plus"></i> Añadir fila</a>
</div>

Y ahora muestro el Jquery con el que añado filas:

$('#add').click(function(event) {
        $("#tabla").each(function() {
        x++;
        var tds = '<tr data-fila='+x+' id="InputsWrapper">';
        jQuery.each($('tr:last td', this), function(index, element) {
            var html = $(this).html();
            if(index == 0){
                html = '<select class="form-control selectSTer js-example-basic-single selectProductos idProducto" name="eProducto[]" style="min-height: 38px;">'+$(this).find('select').html()+'</select>';

                var idProducto = document.getElementsByClassName('idProducto');
                console.log(idProducto);

            }
            if(index == 1){
                html = '<select class="form-control selectSTer js-example-basic-single" name="eTipo[]" style="min-height: 38px;"></select>';
            }
            if(index == 2){
                html = '<input type="text" class="form-control selectTercero inputcalculo  ePrecioUnid" name="ePrecioUnid[]" value="" autocomplete="off">';
            }
            if(index == 3){
                html = '<input type="text" class="form-control selectTercero inputcalculo cntComprada" name="cntComprada[]" value="" autocomplete="off">';
            }
            if(index == 4){
                html = '<input type="text" class="form-control selectTercero inputcalculo eSubTotal" name="eSubTotal[]" value="" autocomplete="off">';
            }
            tds += '<td>' + html+ '</td>';
        });
        tds += '</tr>';
        if ($('tbody', this).length > 0) {
            $('tbody', this).append(tds);
        } else {
            $(this).append(tds);
        }
        });
        var envio = $('#elEnvio').val()
            if(envio == 'undefined'){
            envio = 0;
            return envio;
            }
            actualizarTotales(envio);
    });

Intento sacar el valor del select con var idProducto = document.getElementsByClassName('idProducto'); pero no me devuelve nada la consola, supongo que no sabe en que linea está. No se muy bien como puedo hacerlo.

9
  • En el titulo pones que quieres por jquery, pero en el texto lo estás intentando obtener por javascript, si quieres por jquery puedes usar $(".idProducto option").each(function(){ // $(this).val() }); para obtener los elementos del select Commented el 29 oct. 2020 a las 13:18
  • Hola gracias por tu respuesta @NicolasOñate lo he probado como me comentas pero tampoco muestra nada, como va a saber en que linea está?
    – Miguel
    Commented el 29 oct. 2020 a las 15:49
  • Debería Mostrarlo Commented el 29 oct. 2020 a las 15:59
  • Tenias razón lo tenia dentro de la función de añadir fila, pero esto me muestra todas las opciones yo solo quiero obterner el valor del select que haga click @NicolasOñate
    – Miguel
    Commented el 29 oct. 2020 a las 16:02
  • Con $(".idProducto option:selected").val() obtienes el valor del elemento seleccionado Commented el 29 oct. 2020 a las 16:05

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.