2

Como se puede seleccionar varias filas de un Data Table jQuery, y obtener los datos de la primera columna de cada fila seleccionada????

1
  • 3
    Bienvenido SergioDen, te invito a que pases por aquí, y edites tu pregunta mostrando ¿que has intentado? y ¿que errores te salen? así brindas una mejor pregunta y aumentas la calidad del sitio, también ayudaras a otros a que te den una mejor respuesta acorde a tu problema.
    – JuankGlezz
    Commented el 17 ago. 2016 a las 16:10

1 respuesta 1

2

Te dejo un ejemplo que viene en la pagina de Datatables.net

$(document).ready(function() {
    var table = $('#example').DataTable();
    var dato = "";
    
    //para seleccionar una opcion
    $('#example tbody').on( 'click', 'tr', function () {
        if ( $(this).hasClass('selected') ) {
            $(this).removeClass('selected');
            dato = "";
            console.log(dato);
        }
        else {
            table.$('tr.selected').removeClass('selected');
            $(this).addClass('selected');
            dato = $(this).find("td:eq(0)").text();
            console.log(dato);
        }
    } );
} );
<link href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-1.12.3.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>


<table id="example" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </tfoot>
        <tbody>
            <tr>
                <td>Tiger Nixon</td>
                <td>System Architect</td>
                <td>Edinburgh</td>
                <td>61</td>
                <td>2011/04/25</td>
                <td>$320,800</td>
            </tr>
            <tr>
                <td>Garrett Winters</td>
                <td>Accountant</td>
                <td>Tokyo</td>
                <td>63</td>
                <td>2011/07/25</td>
                <td>$170,750</td>
            </tr>
            <tr>
                <td>Ashton Cox</td>
                <td>Junior Technical Author</td>
                <td>San Francisco</td>
                <td>66</td>
                <td>2009/01/12</td>
                <td>$86,000</td>
            </tr>
            <tr>
                <td>Cedric Kelly</td>
                <td>Senior Javascript Developer</td>
                <td>Edinburgh</td>
                <td>22</td>
                <td>2012/03/29</td>
                <td>$433,060</td>
            </tr>
            <tr>
                <td>Airi Satou</td>
                <td>Accountant</td>
                <td>Tokyo</td>
                <td>33</td>
                <td>2008/11/28</td>
                <td>$162,700</td>
            </tr>
            <tr>
                <td>Brielle Williamson</td>
                <td>Integration Specialist</td>
                <td>New York</td>
                <td>61</td>
                <td>2012/12/02</td>
                <td>$372,000</td>
            </tr>
            <tr>
                <td>Herrod Chandler</td>
                <td>Sales Assistant</td>
                <td>San Francisco</td>
                <td>59</td>
                <td>2012/08/06</td>
                <td>$137,500</td>
            </tr>
            <tr>
                <td>Rhona Davidson</td>
                <td>Integration Specialist</td>
                <td>Tokyo</td>
                <td>55</td>
                <td>2010/10/14</td>
                <td>$327,900</td>
            </tr>
      </tbody>
</table>

Para múltiples opciones se usaría el siguiente fragmento en lugar del código de seleccionar una opción, este código lo puedes encontrar en los ejemplos de datatables.

//multiples opciones
$('#example tbody').on( 'click', 'tr', function () {
    $(this).toggleClass('selected');
    dato = ", " + $(this).find("td:eq(0)").text();
    console.log(dato);
} );
1
  • Funciona, al 100%, te lo agradezco!!!! Commented el 17 ago. 2016 a las 19: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.