Looking for a way to deselect all

GeorgeHelmke

The user is using this to select rows:
$('#CustomerAddressTable tbody').on('click', 'tr', function () {
$(this).toggleClass('selected');
});

I am then performing an operation on the selected rows, which works fine.

But I am stuck on how to deselect all of the selected rows programmatically.
I tried this, but it doesn't make any visible difference:
var tt = new $.fn.dataTable.TableTools(CustomerAddressTable);
tt.fnSelectNone();

Is there a non-tabletools way to do this? It doesn't matter either way, the tableTools script is included in the app.

allan

Hi,

Are you using TableTools? If so, then the fnSelectNone option is the correct way to do it - but you can't just create a new TableTools instance, if there is already one that controls the table. You need to use the existing instance, which you can get using the fnGetInstance static API method and the table ID (in future TableTools will extend the DataTables API making it much easier!).

If you aren't using TableTools, then a $().removeClass() call would be the way to do it, possibly using rows().nodes() to get the nodes from the table.

Allan

GeorgeHelmke

For this table I am not creating a table tools instance afaik, until I create one to do the work desired. However, there are other tables in the same form with table tools defined. Here is what I have:

  CustomerAddressTable = $('#CustomerAddressTable').DataTable({
            bServerSide: true,
            bProcessing: true,
            "deferRender": true,
            bFilter: false,
            bPaginate: false,
            bLengthChange: false,
            bInfo: false,
            sServerMethod: "POST",
            sAjaxSource: "@Url.Action("All", "CustomerShipToAddress")",
            "fnServerParams": function (aoData) {
                aoData.push({ "name": "customer_no", "value": Customer_No });
            },
            aoColumns: aoContactColumnsSetup
        }
        );

        CustomerAddressTable.deselectAll = function () {
            var tt = new $.fn.dataTable.TableTools(CustomerAddressTable);
            tt.fnSelectNone();
            

        }

        $('#CustomerAddressTable tbody').on('click', 'tr', function () {
            $(this).toggleClass('selected');
        });

allan

Hi George,

So if you aren't using TableTools for the initial row selection, I would suggest not using it to do the de-selection (since it won't have any rows selected using its own mechanism).

How about using:

omerAddressTable.deselectAll = function () {
          $('#CustomerAddressTable tbody tr').removeClass('selected');
      }

It is worth being careful with row selection and server-side processing. A draw of the table will cause the row selection to be lost, unless you use something like in this example.

Regards,
Allan