Answers

• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  February 2022 Answer ✓

  Use a column filter - column().search().

  Allan
• carlyip Posts: 3Questions: 1Answers: 0

  February 2022 edited February 2022

  Hi i have embeded this lines of code and commented previous code

  
  var table = $('#table-item').DataTable();
   
  table.columns( '.select-filter' ).every( function () {
      var that = this;
   
      // Create the select list and search operation
      var select = $('<select />')
          .appendTo(
              this.footer()
          )
          .on( 'change', function () {
              that
                  .search( $(this).val() )
                  .draw();
          } );
   
      // Get the search data for the first column and add to the select list
      this
          .cache( 'search' )
          .sort()
          .unique()
          .each( function ( d ) {
              select.append( $('<option value="'+d+'">'+d+'</option>') );
          } );
  } );
  

  but my page oni display this, nothing display or changed
  https://pasteboard.co/bIjzwFT6wY8g.png
• carlyip Posts: 3Questions: 1Answers: 0

  February 2022 edited February 2022

  This is my previous code

  
          $(document).ready( function () {
      $('#table-item').DataTable();
      } );
  
  
  
  
• kthorngren Posts: 21,336Questions: 26Answers: 4,951

  February 2022

  This code is appending to the footer:

          .appendTo(
              this.footer()
          )
  

  But your table doesn't have a tfoot. Define a footer for your table.

  Kevin