Select-checkbox in column renders, but is not clickable

rdm · October 2017

In order to satisfy a user requirement, I need to add a checkbox-column that is not a part of the data model. A button that I click will read only the rows where that checkbox is clicked and perform a function.

My problem is that while I can get the checkbox to render on the page, when I click it, nothing happens. I don't see any runtime or compile errors.

The first column still works as intended: when the first column is clicked, the entire row is selected and the "Edit" button is then enabled. It's the second column that is not clickable at all.

What do I need to do in order to make that column clickable?

columns:
    [
        {
            /* used to select record for "Edit" button */
            data: null,
            defaultContent: '',
            className: 'select-checkbox',
            orderable: false,
            searchable: false
        },
        {
            /* used to select multiple records for use in custom function */
            data: null,
            defaultContent: '',
            className: 'select-checkbox',
            orderable: false,
            searchable: false
        }
        /* ... more columns ... */
    ]

Tester2017 · October 2017

Try this:

      'columnDefs': [{
         'targets': 0,
         'searchable':false,
         'orderable':false,
         'render': function (data, type, full, meta){
             return '<input type="checkbox" name="id[]" value="' 
                + $('<div/>').text(data).html() + '">';
         }
      },
      {
         'targets': 1,
         'searchable':false,
         'orderable':false,
         'render': function (data, type, full, meta){
             return '<input type="checkbox" name="id[]" value="' 
                + $('<div/>').text(data).html() + '">';
         }
      }],

I think the problem you had is caused by the fact that you are assigning a values (null) to data and not (unique) references.

rdm · October 2017

Thanks @Tester2017 -- I hasn't seen "columnDefs" in use before. This solves a few different problems of mine too.

Select-checkbox in column renders, but is not clickable

Select-checkbox in column renders, but is not clickable

Answers

Howdy, Stranger!

Categories

DataTables

Select-checkbox in column renders, but is not clickable

Select-checkbox in column renders, but is not clickable

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables