Jquery + Datatables: enable/disable ALL checkboxes

Question

Hi everybody I have a struggling problem that makes me "crazy". I used the following code to create instead of using the 'css' version of checkbox, used in DataTables js plugin, and set all of them DISABLED:

table = $('#DISCOVEREDSW').DataTable(
{
    paging: true,
    "processing": true,
    "ajax": "catalogo_discoveredSw.php",
    "deferLoading": 57,
    "deferRender": true,
    "scrollY": 350,
    "iDisplayLength": 100,
    "scrollX": true,
    "bRetrieve": true,
    "bDestroy": true,
    "ordering": true,
    "info":     true,
    "sDom":     'ltipr',
    "bDestroy": true,
    'columnDefs': [{
        'targets': 0,
        'searchable':false,
        'orderable':false,
        'className': 'dt-body-center',
        'render': function (data, type, full, meta){
            return '<input class="checkCompSw" disabled="true" type="checkbox" name="id[]" value="' + $('<div/>').text(data).html() + '">';
        }
    }]
}

I would like to set DISABLED = false to ALL THE checkboxes so I try:

<script>
    $(document).ready(function() {
        $('#associaDissociaApp').click(function()
        {
            $('#applicationBox').show("slow","linear");
            $('.checkCompSw').prop('disabled', false);
            $('#annulla').click(function() {
                $('#applicationBox').hide("slow","linear");
                $('.checkCompSw').prop('disabled', true);
            });
        });
    });
</script>

The real problem is that only THE SHOWN CHECKBOXES ARE SET DISABLED=FALSE: I mean, if I move between the other pages all the checkboxes are still disabled and only in the first page I see all the checkbox enabled. Of course, I need a script to make all of them disabled again when I click on a button to disable them again.

Someone could please help me to figure it out?

Many thanks in advance. :)

Gyrocode.com · Accepted Answer · 2018-06-14 16:12:54Z

1

DataTables plugin removes elements from all pages except current from DOM.

Use $() API method to access elements that are not present in DOM.

Use the code below to disable checkboxes on all pages.

$('#DISCOVEREDSW').DataTable().$('.checkCompSw').prop('disabled', false);

You may also need to disable deferred rendering by removing deferLoading and deferRender because elements from never displayed pages will be inaccessible even for $() API method.

answered Jun 14, 2018 at 16:12

Gyrocode.com

59k16 gold badges157 silver badges192 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Jquery + Datatables: enable/disable ALL checkboxes

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related