Add highlight on hover for a datatable

To add highlight on hover for a datatable, you can use the rowCallback option in the DataTables initialization. Here is an example code snippet:

$(document).ready(function() {
  $('#example').DataTable({
    "rowCallback": function( row, data ) {
      $(row).hover(function(){
        $(this).addClass('highlight');
      }, function(){
        $(this).removeClass('highlight');
      });
    }
  });
});

In this code, we're using jQuery's hover method to add or remove the class highlight to the row based on mouse enter or leave events. Then, we define the rowCallback function to handle this behavior for each row in the table.

Note that in this example, we assume that you have defined a CSS class named highlight to style the hovered row. You can define this class in your stylesheet as follows:

.highlight {
  background-color: yellow;
}

This will give the rows a yellow background when they are hovered over. You can change the styles in this class to suit your needs.

Komentar

Postingan populer dari blog ini

WhatsApp Web login QR code in an HTML page using whatsapp-web.js

Node.js Telegram Bot API send an image with text

Add these security headers to your website