0

He estado teniendo dificultades planeando la lógica para este problema.

Tengo una tabla con diversos tipos de input (text,date,checklist) y deseo imprimirlos en el orden dado por la primera tabla, pero tengo problemas cuando selecciono algunos input.

Este es el código HTML que estoy usando:

Actualizacion: ¿Cómo podría guardar el segundo date de las vigencias y guardar el value del select?

$('#botones').click(function() {
  var values = [];

  $('#TableID input[class="chk"]:checked').each(function() {
    var row = $(this).closest("tr");
    values.push({
      eleccion: $(this).val(),
      especificacion: $(row).find("input[name=id]").val(),
      suma: $(row).find("input[name=cobertura_suma]").val(),
      plazo: $(row).find('option:selected').val(),/*Aqui quiero guardar el valor del select, pero no se como*/
      vigencia: $(row).find("input[name=cobertura_vigencia_ini] ").val(),
      gen: $(row).find("input[name=cobertura_vigencia_fin] ").val()/*no me deja sacar el valor de esta fecha*/

    });
  });
  console.log(values);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="tablaMaestra" id="tablaMaestra">
  <thead>
    <tr>
      <th>Tipo de póliza <br>Marcar la opción(es)</th>
      <th>Moneda (Especificar)</th>
      <th>Suma Asegurada</th>
      <th>Plazo de vigencia <br>de la fianza</th>
      <th>Vigencia (desde / hasta)</th>
    </tr>
  </thead>
  <tbody id="TableID">
    <tr>

      <td class="tipo_id[]">
        <input type="checkbox" name="poliza" value="seriedad" class="chk" id="chk">Seriedad de oferta
      </td>
      <td class="tipo_id[]">
        <div class="cambio_dinero ">
          <select name="cobertura_moneda" id="cobertura_moneda" class="cobertura_moneda">
            <option value="S/">S/</option>
            <option value="$">$</option>
            <option value="£">£</option>
          </select>
        </div>

      </td>

      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>

      <td class="tipo_id[]">
        <input type="text" name="cobertura_fianza" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>

      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>

    </tr>

    <tr>
      <td cclass="tipo_id[]"><input type="checkbox" class="chk" name="poliza" value="fiel">Fiel Cumplimiento</td>
      <td class="tipo_id[]">
        <select name="" id="cobertura_moneda" class="cobertura_moneda">
          <option value="soles">S/</option>
          <option value="dolar">$</option>
          <option value="euros">£</option>
        </select>
      </td>
      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="text" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>
    </tr>
    <tr>
      <td class="tipo_id[]"><input type="checkbox" class="chk" name="poliza" value="directo">Adelanto Directo</td>
      <td class="tipo_id[]">
        <select name="" id="cobertura_moneda" class="cobertura_moneda">
          <option value="soles">S/</option>
          <option value="dolar">$</option>
          <option value="euros">£</option>
        </select>
      </td>
      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="text" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>
    </tr>
    <tr>
      <td class="tipo_id[]"><input type="checkbox" class="chk" name="poliza" value="materiales">Adelanto para materiales</td>
      <td class="tipo_id[]">
        <select name="" id="cobertura_moneda" class="cobertura_moneda">
          <option value="soles">S/</option>
          <option value="dolar">$</option>
          <option value="euros">£</option>
        </select>
      </td>
      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="text" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>
    </tr>
    <tr>
      <td class="tipo_id[]"><input type="checkbox" class="chk" name="poliza" value="otros">Otros(Especificar) <input type="text" class="opciones_otros" size="4" id="opciones_otros" placeholder="Especifique"></td>
      <td class="tipo_id[]">
        <select name="" id="cobertura_moneda" class="cobertura_moneda">
          <option value="soles">S/</option>
          <option value="dolar">$</option>
          <option value="euros">£</option>
        </select>
      </td>
      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="text" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>
    </tr>

  </tbody>
</table>
<button id="botones" class="botones">botones</button>

<div id="section-to-print">

  <table class="impresion">
    <div class="modelo clearfix">

      <tr class=" nuevo">
        <td>Tipo de póliza <br>Marcar la opción(es)</td>
        <td>Moneda (Especificar)</td>
        <td>Suma Asegurada</td>
        <td>Plazo de vigencia <br>de la fianza</td>
        <td>Vigencia (desde / hasta)</td>
      </tr>
      <tr class=" nuevo">
        <td class="cober_poliza"></td>

        <td class="cober_moneda cober_dinero"></td>


        <td class="cober_suma"></td>
        <td class="cober_fianza"></td>
        <td class="cober_vigencia_ini cober_vigencia_fin"></td>

      </tr>

      <tr class=" nuevo">
        <td class="cobertura_poliza1"></td>

        <td class="cober_moneda1 cober_dinero1"></td>

        <td class="cober_suma1"></td>
        <td class="cober_fianza1"></td>
        <td class="cober_vigencia_ini1 cober_vigencia_fin1"></td>
      </tr>

      <tr class=" nuevo">
        <td class="cobertura_poliza2"></td>

        <td class="cober_moneda2 cober_dinero2"></td>

        <td class="cober_suma2"></td>
        <td class="cober_fianza2"></td>
        <td class="cober_vigencia_ini2 cober_vigencia_fin2"></td>
      </tr>
      <tr class="nuevo">
        <td class="cobertura_poliza3"></td>

        <td class="cober_moneda3 cober_dinero3"></td>

        <td class="cober_suma3"></td>
        <td class="cober_fianza3"></td>
        <td class="cober_vigencia_ini3 cober_vigencia_fin3"></td>
      </tr>
      <tr class="nuevo">
        <td class="cobertura_poliza4"></td>

        <td class="cober_moneda4 cober_dinero4"></td>

        <td class="cober_suma4"></td>
        <td class="cober_fianza4"></td>
        <td class="cober_vigencia_ini4 cober_vigencia_fin4"></td>
      </tr>
  </table>

  </div>

5
  • No se ve el código Javascript que usas, ni tampoco se entiende cuál es el problema en sí.
    – A. Cedano
    Commented el 15 dic. 2018 a las 0:37
  • El problema tal vez sea que no tienes código javascript, para agregarlo debes hacerlo en una etiqueta script, aquí un tutorial de como hacerlo w3schools.com/Html/html_scripts.asp Commented el 15 dic. 2018 a las 1:32
  • mil disculpas, me olvide colocar aqui el codigo, este fue el que plantee para almacenar los datos en un array (me falta el del selec) . Commented el 15 dic. 2018 a las 1:34
  • com imprimir te refieres a en una impresora o imprimirlo a consola? Commented el 15 dic. 2018 a las 1:42
  • De la primera tabla se deben registrar datos, y esos se imprimen (Se mandan) a otra tabla donde se veran los datos registrados. Lo de impresion en un printer ya se hacerlo, solo tengo problemas al querer obtener el valor de del select y la segunda fecha vigencia final , Commented el 15 dic. 2018 a las 1:46

1 respuesta 1

2

varias cosas:

  1. Ojo con el HTML. Estás utilizando el mismo id para los mismos elementos en tus distintos <tr> (cobertura_moneda, cobertura_vigencia_ini, etc.). Ten en cuenta que los ids deben ser únicos. Por otra parte, estás definiendo el name de cobertura_moneda en el primer select pero no en los siguientes y a la hora de utilizar los selectores por name no te funcionará.

  2. Selectores. Hay varios errores:

    • Aquí estás buscando un input cuyo nombre sea id:

    $(row).find("input[name=id]").val()

    Lo que deberías hacer es buscar un select (no es tipo input si no select) cuyo name sea cobertura_moneda. Y en concreto la option seleccionada (más info sobre selectores). Aquí he puesto que muestre el .val() pero podrías querer obtener el .text()

    $(row).find("select[name=cobertura_moneda] option:selected").val()

    • En este punto entiendo que quieres obtener el valor del select cobertura_moneda:

    plazo: $(row).find('option:selected').val(),/*Aqui quiero guardar el valor del select, pero no se como*/

En ese caso sería como he puesto antes:

$(row).find("select[name=cobertura_moneda] option:selected").val()
  • Por último aquí no termino de entender el problema.

gen: $(row).find("input[name=cobertura_vigencia_fin] ").val()/*no me deja sacar el valor de esta fecha*/

Yo lo veo bien:

[
  {
    "eleccion": "seriedad",
    "especificacion": "S/",
    "suma": "234",
    "plazo": "S/",
    "vigencia": "2018-12-04",
    "gen": "2018-12-27"
  }
]

Aquí te dejo un ejemplo funcionando (los ids no los he cambiado para que sean únicos, habría que hacerlo):

$('#botones').click(function() {
  let values = [];

  $('#TableID input[class="chk"]:checked').each(function() {
    let row = $(this).closest("tr");
    values.push({
      eleccion: $(this).val(),
      especificacion: $(row).find("select[name=cobertura_moneda] option:selected").val(),
      suma: $(row).find("input[name=cobertura_suma]").val(),
      plazo: $(row).find("select[name=cobertura_moneda] option:selected").val(),/*Aqui quiero guardar el valor del select, pero no se como*/
      vigencia: $(row).find("input[name=cobertura_vigencia_ini] ").val(),
      gen: $(row).find("input[name=cobertura_vigencia_fin] ").val()/*no me deja sacar el valor de esta fecha*/

    });
  });
  console.log(values);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="tablaMaestra" id="tablaMaestra">
  <thead>
    <tr>
      <th>Tipo de póliza <br>Marcar la opción(es)</th>
      <th>Moneda (Especificar)</th>
      <th>Suma Asegurada</th>
      <th>Plazo de vigencia <br>de la fianza</th>
      <th>Vigencia (desde / hasta)</th>
    </tr>
  </thead>
  <tbody id="TableID">
    <tr>
      <td class="tipo_id[]">
        <input type="checkbox" name="poliza" value="seriedad" class="chk" id="chk">Seriedad de oferta
      </td>
      <td class="tipo_id[]">
        <div class="cambio_dinero ">
          <select name="cobertura_moneda" id="cobertura_moneda" class="cobertura_moneda">
            <option value="S/">S/</option>
            <option value="$">$</option>
            <option value="£">£</option>
          </select>
        </div>

      </td>

      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>

      <td class="tipo_id[]">
        <input type="text" name="cobertura_fianza" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>

      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>

    </tr>

    <tr>
      <td cclass="tipo_id[]"><input type="checkbox" class="chk" name="poliza" value="fiel">Fiel Cumplimiento</td>
      <td class="tipo_id[]">
        <select name="cobertura_moneda" id="cobertura_moneda" class="cobertura_moneda">
          <option value="soles">S/</option>
          <option value="dolar">$</option>
          <option value="euros">£</option>
        </select>
      </td>
      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="text" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>
    </tr>
    <tr>
      <td class="tipo_id[]"><input type="checkbox" class="chk" name="poliza" value="directo">Adelanto Directo</td>
      <td class="tipo_id[]">
        <select name="cobertura_moneda" id="cobertura_moneda" class="cobertura_moneda">
          <option value="soles">S/</option>
          <option value="dolar">$</option>
          <option value="euros">£</option>
        </select>
      </td>
      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="text" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>
    </tr>
    <tr>
      <td class="tipo_id[]"><input type="checkbox" class="chk" name="poliza" value="materiales">Adelanto para materiales</td>
      <td class="tipo_id[]">
        <select name="cobertura_moneda" id="cobertura_moneda" class="cobertura_moneda">
          <option value="soles">S/</option>
          <option value="dolar">$</option>
          <option value="euros">£</option>
        </select>
      </td>
      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="text" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>
    </tr>
    <tr>
      <td class="tipo_id[]"><input type="checkbox" class="chk" name="poliza" value="otros">Otros(Especificar) <input type="text" class="opciones_otros" size="4" id="opciones_otros" placeholder="Especifique"></td>
      <td class="tipo_id[]">
        <select name="cobertura_moneda" id="cobertura_moneda" class="cobertura_moneda">
          <option value="soles">S/</option>
          <option value="dolar">$</option>
          <option value="euros">£</option>
        </select>
      </td>
      <td class="tipo_id[]">
        <input type="text" name="cobertura_suma" id="cobertura_suma" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="text" id="cobertura_fianza" style="width:100px" class="cobertura">
      </td>
      <td class="tipo_id[]">
        <input type="date" name="cobertura_vigencia_ini" id="cobertura_vigencia_ini">
        <input type="date" name="cobertura_vigencia_fin" id="cobertura_vigencia_fin">
      </td>
    </tr>

  </tbody>
</table>
<button id="botones" class="botones">botones</button>

<div id="section-to-print">

  <table class="impresion">
    <div class="modelo clearfix">

      <tr class=" nuevo">
        <td>Tipo de póliza <br>Marcar la opción(es)</td>
        <td>Moneda (Especificar)</td>
        <td>Suma Asegurada</td>
        <td>Plazo de vigencia <br>de la fianza</td>
        <td>Vigencia (desde / hasta)</td>
      </tr>
      <tr class=" nuevo">
        <td class="cober_poliza"></td>

        <td class="cober_moneda cober_dinero"></td>


        <td class="cober_suma"></td>
        <td class="cober_fianza"></td>
        <td class="cober_vigencia_ini cober_vigencia_fin"></td>

      </tr>

      <tr class=" nuevo">
        <td class="cobertura_poliza1"></td>

        <td class="cober_moneda1 cober_dinero1"></td>

        <td class="cober_suma1"></td>
        <td class="cober_fianza1"></td>
        <td class="cober_vigencia_ini1 cober_vigencia_fin1"></td>
      </tr>

      <tr class=" nuevo">
        <td class="cobertura_poliza2"></td>

        <td class="cober_moneda2 cober_dinero2"></td>

        <td class="cober_suma2"></td>
        <td class="cober_fianza2"></td>
        <td class="cober_vigencia_ini2 cober_vigencia_fin2"></td>
      </tr>
      <tr class="nuevo">
        <td class="cobertura_poliza3"></td>

        <td class="cober_moneda3 cober_dinero3"></td>

        <td class="cober_suma3"></td>
        <td class="cober_fianza3"></td>
        <td class="cober_vigencia_ini3 cober_vigencia_fin3"></td>
      </tr>
      <tr class="nuevo">
        <td class="cobertura_poliza4"></td>

        <td class="cober_moneda4 cober_dinero4"></td>

        <td class="cober_suma4"></td>
        <td class="cober_fianza4"></td>
        <td class="cober_vigencia_ini4 cober_vigencia_fin4"></td>
      </tr>
  </table>

  </div>

Tu Respuesta

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

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.