http://jsfiddle.net/05xnxzbd/
--Seleccionar CheckBox que resultan de la Busqueda
$("[id*='id_seleccionar_todos']").click(function () {
var flag_estado_seleccionar = $("[id*='id_seleccionar_todos']").is(":checked");
var oTable = $('#tblCombos').dataTable();
var rowcollection = oTable.$("tr", { "page": "all" });
rowcollection.each(function () {
var nombreCombo = $(this).find('td:eq(1)').text().toUpperCase();
var criterio = $("#id_buscar_filtrar").val().toUpperCase();
if(nombreCombo.indexOf(criterio) !== -1){
$(this).find(":checkbox").prop("checked", flag_estado_seleccionar);
}
});
});
$("[id*='id_seleccionar_todos']").click(function () {
var flag_estado_seleccionar = $("[id*='id_seleccionar_todos']").is(":checked");
var contador = 0;
//$("input[type=checkbox]").each(function () {
// $(this).prop("checked", flag_estado_seleccionar);
// contador++;
// //console.log(contador);
//});
var oTable = $('#tblCombos').dataTable();
var rowcollection = oTable.$("input[type=checkbox]", { "page": "all" });
rowcollection.each(function () {
$(this).prop("checked", flag_estado_seleccionar);
});
});
HTML
<!DOCTYPE html><html><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script><script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script><link rel="stylesheet" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css"><body><h1>Guia para seleccionar todos los controles CheckBox</h1><h3>Esto es una copia del codigo de la pantlla de Combos, que al no tener ambiente, se replicó el escenario</h3><input id="id_seleccionar_todos" type="checkbox" name="" value="" /> <span style='font-size:14px;color:#424242;'>SELECCIONAR/TODOS</span> (<span style='font-size:13px;color:#07728E;'>Para habilitar esta opción debe seleccionar la página <b style=''>Ver todos</b></span>)<hr><table id="tblCombos" class="table table-striped table-hover dt-responsive dataTable no-footer DTTT_selectable dtr-column collapsed" cellspacing="0" role="grid" aria-describedby="tblCombos_info" style="width: 1565px;"><thead> <tr role="row" style="height: 0px;"><th class="all sorting_asc" aria-controls="tblCombos" rowspan="1" colspan="1" style="width: 155px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;" aria-label="IdCombo: Activar para ordenar la columna de manera descendente" aria-sort="ascending"><div class="dataTables_sizing" style="height:0;overflow:hidden;">IdCombo</div></th><th class="all sorting" aria-controls="tblCombos" rowspan="1" colspan="1" style="width: 342px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;" aria-label="Nombre Combo: Activar para ordenar la columna de manera ascendente"><div class="dataTables_sizing" style="height:0;overflow:hidden;">Nombre Combo</div></th><th class="all sorting" aria-controls="tblCombos" rowspan="1" colspan="1" style="width: 203px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;" aria-label="Fecha Inicial: Activar para ordenar la columna de manera ascendente"><div class="dataTables_sizing" style="height:0;overflow:hidden;">Fecha Inicial</div></th><th class="all sorting" aria-controls="tblCombos" rowspan="1" colspan="1" style="width: 190px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;" aria-label="Fecha Final: Activar para ordenar la columna de manera ascendente"><div class="dataTables_sizing" style="height:0;overflow:hidden;">Fecha Final</div></th><th class="all sorting" aria-controls="tblCombos" rowspan="1" colspan="1" style="width: 137px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;" aria-label="Estatus: Activar para ordenar la columna de manera ascendente"><div class="dataTables_sizing" style="height:0;overflow:hidden;">Estatus</div></th><th class="all sorting" aria-controls="tblCombos" rowspan="1" colspan="1" style="width: 193px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;" aria-label="Seleccionar: Activar para ordenar la columna de manera ascendente"><div class="dataTables_sizing" style="height:0;overflow:hidden;">Seleccionar</div></th><th class="all sorting" aria-controls="tblCombos" rowspan="1" colspan="1" style="width: 156px; padding-top: 0px; padding-bottom: 0px; border-top-width: 0px; border-bottom-width: 0px; height: 0px;" aria-label="Consulta: Activar para ordenar la columna de manera ascendente"><div class="dataTables_sizing" style="height:0;overflow:hidden;">Consulta</div></th></tr> </thead> <tbody><tr role="row" class="odd"><td class="sorting_1">493</td><td>COMBOS PRUEBA UAT 2 CELSTEL CEL 4G SAMSUNG J4 CORE NEG</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(493)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="even"><td class="sorting_1">494</td><td>COMBOS PRUEBA UAT VALES UNISUPERTEL CEL 4G HUAWEI Y5 8GB 2018 DOR + VALE DE Q100 UNISUPER REGALIA</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(494)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="odd"><td class="sorting_1">495</td><td>COMBOS PRUEBA UAT RECARGA 1500 TEL CEL 4G SAMSUNG J4 CORE NEG + RECARGA ELECTRONICA MOVISTAR</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(495)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="even"><td class="sorting_1">496</td><td>COMBOS PRUEBA UAT RECARGA 500 TEL CEL 4G HUAWEI P30 AZ + RECARGA ELECTRONICA TIGO</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(496)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="odd"><td class="sorting_1">497</td><td>COMBOS PRUEBA UAT 2 CELS TEL CEL 4G SAMSUNG J4 CORE NEG </td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(497)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="even"><td class="sorting_1">498</td><td>COMBOS PRUEBA UAT 1 REGALIA TV LED 60" LG 60UM7270PSA SMART 4K + TECLADO MICROSOFT C/SOPORTE COMBO</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(498)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="odd"><td class="sorting_1">499</td><td>COMBOS PRUEBA UAT 2 REGALIAS SET COL OLYMPIA SALUD KING 200X200 + LICUADORA OSTER BRLY07R00 VID 3 V</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(499)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="even"><td class="sorting_1">500</td><td>COMBOS PRUEBA UAT 3 REGALIAS REF AUTO WHIRLP LWT1615Q 16CF 473L BLC + HORNO MIC WHIRLP WM1211D 1.1CF SILVER</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(500)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="odd"><td class="sorting_1">501</td><td>COMBOS PRUEBA UAT 4 REGALIAS MOTO SERPENTO ASPID 150 ROJ 2020 + AUDIF PAST KLIP EXTREME KHS633BL BT</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(501)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr><tr role="row" class="even"><td class="sorting_1">502</td><td>COMBOS PRUEBA UAT PRODS CON DESC MAQ COSER BROTHER XM2701 + OLLA PRES SANKEY K11 11L</td><td>01/08/2019</td><td>30/11/2019</td><td>Activo</td><td><input type="checkbox"></td><td><button type="button" onclick="modalBusquedaCombo.fnCargarPantallaModal(502)" class="btn btn-success btn-busqueda-combo"><i class="fa fa-search"></i></button></td></tr></tbody> </table> </body></html>
JAVASCRIPT
$( document ).ready(function() {
$("[id*='id_seleccionar_todos']").attr("disabled", true);
$('#tblCombos').dataTable( {
"lengthMenu": [[5, 10, 50, -1], [5, 10, 50, "Ver todos"]],
"searching": false,
"language": {
"lengthMenu": "Mostrar _MENU_ registros por página",
"info": "Mostrando _START_ a _END_ de _TOTAL_ resultados",
"zeroRecords": "No se encontraron resultados :( ",
"infoEmpty": "No se encontraron resultados :( ",
"infoFiltered": "(filtered from _MAX_ total records)",
"sSearch": "Buscar: ",
paginate: {
next: 'Siguiente', // or '→' →
previous: 'Anterior' // or '←' ←
}
}
} );
$("[id*='id_seleccionar_todos']").click(function(){
var flag_estado_seleccionar = $("[id*='id_seleccionar_todos']").is (":checked");
var contador = 0;
$("input[type=checkbox]").each(function(){
$(this).prop("checked", flag_estado_seleccionar);
contador++;
//console.log(contador);
});
});
setInterval(function(){
$( "select option:selected" ).each(function() {
$("[id*='id_seleccionar_todos']").attr("disabled", true);
if($(this).val() == "-1")
{
//true habilitar checkbox seleccionar todos
$("[id*='id_seleccionar_todos']").removeAttr("disabled");
}
});
}, 200);
});
No hay comentarios:
Publicar un comentario