0
    <table id="" class="table table-responsive-lg table-responsive-md table-responsive-sm table-responsive-xs table-hover table-outline mb-0">
   <tbody>
      <tr class="bg-dark">
         <th>
            <h4>Fecha</h4>
         </th>
         <th>
            <h4>Hora entrada</h4>
         </th>
         <th>
            <h4>Hora salida</h4>
         </th>
         <th>
            <h4>Descanso</h4>
         </th>
         <th>
            <h4>Horas laboradas</h4>
         </th>
         <th>
            <h4>Proyecto</h4>
         </th>
         <th>
            <h4>Observaciones</h4>
         </th>
      </tr>
   </tbody>
   <tbody>
      <tr style="cursor: pointer;">
         <td>2018-09-01</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-02</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-03</td>
         <td>05:30 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>11:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-04</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-05</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-06</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-07</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-08</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Sábado no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-09</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-10</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-11</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-12</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-13</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-14</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-15</td>
         <td>07:00 am</td>
         <td>01:00 pm</td>
         <td>00:00</td>
         <td>06:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-16</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-17</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-18</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-19</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-20</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-21</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-22</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Sábado no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-23</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-24</td>
         <td>07:00 am</td>
         <td>09:00 pm</td>
         <td>01:00</td>
         <td>13:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-25</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-26</td>
         <td>07:00 am</td>
         <td>07:00 pm</td>
         <td>01:00</td>
         <td>11:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-27</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-28</td>
         <td>07:00 am</td>
         <td>10:00 pm</td>
         <td>04:00</td>
         <td>11:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-29</td>
         <td>08:00 am</td>
         <td>11:30 am</td>
         <td>00:00</td>
         <td>03:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-30</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr>
         <td colspan="4">
            <h3>Total</h3>
         </td>
         <td colspan="3">
            <h3>221:30</h3>
         </td>
      </tr>
      <!---->
   </tbody>
</table>
4
  • @Ricardo ¿Cómo hizo usted para ordenar la tabla en bloques? Commented el 2 nov. 2018 a las 22:04
  • ha que se refiere usted? Commented el 2 nov. 2018 a las 22:21
  • Cuando yo publiqué esta pregunta el código de la tabla estaba todo desordenado y usted lo ordenó por bloques para hacerlo más legible, ¿cómo o hizo? Commented el 2 nov. 2018 a las 22:30
  • No recuerdo muy bien amigo, pero fue en una herramienta para indentar código por ejemplo: Enlace Commented el 2 nov. 2018 a las 22:44

1 respuesta 1

2

Puedes usar JQuery para hacer referencia a las cabeceras y registros de cada tabla, la siguiente función te puede ayudar:

var myRows = [];
var $headers = $("th h4");
var $rows = $("tbody tr").each(function(index) {
  $cells = $(this).find("td");
  myRows[index] = {};
  $cells.each(function(cellIndex) {
    myRows[index][$($headers[cellIndex]).html()] = $(this).html();
  });    
});

var myObj = {};
myObj.myrows = myRows;
console.log(JSON.stringify(myObj));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="" class="table table-responsive-lg table-responsive-md table-responsive-sm table-responsive-xs table-hover table-outline mb-0">
   <tbody>
      <tr class="bg-dark">
         <th>
            <h4>Fecha</h4>
         </th>
         <th>
            <h4>Hora entrada</h4>
         </th>
         <th>
            <h4>Hora salida</h4>
         </th>
         <th>
            <h4>Descanso</h4>
         </th>
         <th>
            <h4>Horas laboradas</h4>
         </th>
         <th>
            <h4>Proyecto</h4>
         </th>
         <th>
            <h4>Observaciones</h4>
         </th>
      </tr>
   </tbody>
   <tbody>
      <tr style="cursor: pointer;">
         <td>2018-09-01</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-02</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-03</td>
         <td>05:30 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>11:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-04</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-05</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-06</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-07</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-08</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Sábado no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-09</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-10</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-11</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-12</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-13</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-14</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-15</td>
         <td>07:00 am</td>
         <td>01:00 pm</td>
         <td>00:00</td>
         <td>06:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-16</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-17</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-18</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-19</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-20</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>00:30</td>
         <td>10:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-21</td>
         <td>07:00 am</td>
         <td>06:00 pm</td>
         <td>01:00</td>
         <td>10:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-22</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Sábado no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-23</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-24</td>
         <td>07:00 am</td>
         <td>09:00 pm</td>
         <td>01:00</td>
         <td>13:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-25</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-26</td>
         <td>07:00 am</td>
         <td>07:00 pm</td>
         <td>01:00</td>
         <td>11:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-27</td>
         <td>07:00 am</td>
         <td>05:00 pm</td>
         <td>01:00</td>
         <td>09:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-28</td>
         <td>07:00 am</td>
         <td>10:00 pm</td>
         <td>04:00</td>
         <td>11:00</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-29</td>
         <td>08:00 am</td>
         <td>11:30 am</td>
         <td>00:00</td>
         <td>03:30</td>
         <td>Contrato 343/2017</td>
         <td>Sin obsevación</td>
      </tr>
      <tr style="cursor: pointer;">
         <td>2018-09-30</td>
         <td>12:00 am</td>
         <td>12:00 am</td>
         <td>00:00</td>
         <td>00:00</td>
         <td>Contrato 343/2017</td>
         <td>Dominical no laborado</td>
      </tr>
      <tr>
         <td colspan="4">
            <h4>Total</h4>
         </td>
         <td colspan="3">
            <h4>221:30</h4>
         </td>
      </tr>
      <!---->
   </tbody>
</table>

Espero te ayude. Saludos.

4
  • Gracias muy buena esa función. Me gustaría saber por que o para que le coloca el signo $ a las variables como si fuese PHP. Commented el 30 oct. 2018 a las 19:35
  • 1
    Es JQuery, en este ejemplo se usó para hacer referencias a las partes de la tabla, puedes leer un poco su documentación y te será de mucha utilidad. Commented el 30 oct. 2018 a las 19:43
  • 2
    myRows[index][$($headers[cellIndex]).text()] = $(this).tex(); para eliminar las filas que tengan contendios h4 como en total!
    – Bryro
    Commented el 30 oct. 2018 a las 19:54
  • Muchas gracias para lo que yo busco me sobran las últimas lineas, pero esta buena es función. Commented el 30 oct. 2018 a las 20:01

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.