Search() found in hidden columns

Search() found in hidden columns

AndiWafflesAndiWaffles Posts: 4Questions: 2Answers: 0

hey guys,

im facing the following problem: I have a Datatable with a searchfield.
If the Term is found, the table gets filtered and the found string gets marked (jquery.mark()).

I have 2 hidden columns in my table, which shall be searched aswell. If the term is found in the row->hidden cell I want so show an sign which sais something like 'found in field name' (which is hidden)

how could i achieve to determine in which cell the matched string is if it is hidden?

Many thanks in advance

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 20,150Questions: 26Answers: 4,736

    One option might be to use filter() to see if the search term is found in the hidden columns. You can get the search term using search(). You can use column-selector to select the hidden columns using the selector :hidden. Finally use the count() API to count how many times the search term appears in the hidden columns. Here is a simple example:
    http://live.datatables.net/bozuqitu/1/edit

    It looks for the number of times 17 appears in the hidden columns (3). Note there are a total of 4 17 values in the table, one is shown.

    The trick is to change the comparison to work with either regex or smart searching. These search modes are described in the search() docs.

    Hope this gets you started.

    Kevin

  • AndiWafflesAndiWaffles Posts: 4Questions: 2Answers: 0

    Thank you for your fast answer and for your help. So far I get the desired data and can compare it with my searchString. Now i want show the sign/hint that the term was found in an hidden field (see screenshot)

    My code setup is the following:
    columns: [
    .
    .
    .
    { data: null,
    searchable: false,
    width: '15px',
    defaultContent: '',
    },
    .
    .
    .

    drawCallback: function( settings ) {

    var filteredData = contacts_table
      .columns( [ 4, ':hidden'] )
      .data()
      .flatten()
      .filter( function ( value, index ) {
    
       if (~value.toLowerCase().indexOf( contacts_table.search().toLowerCase() )){
    
            contacts_table.cell( index, 8 ).data( '<div class="tooltip_show searchinfo" title="Ihr Suchbegriff wurde im <strong>Vornamen</strong> und im <strong>Nachnamen</strong> gefunden."></div>' );
    
            }
    } );
    

    }

    How can I change the html of the cell dynamically? Is this a good approach? First idea was to set the html in the column definition under default content (with css display:none) and then just show it if the condition in the drawcallback is true.

    Hope I made my intention clear ^^

    Best regards,

    Andi

  • colincolin Posts: 15,118Questions: 1Answers: 2,583
    Answer ✓

    Yep, either drawCallback or rowCallback sounds like the place for that,

    Colin

  • AndiWafflesAndiWaffles Posts: 4Questions: 2Answers: 0

    Hey Colin,

    Thank you for the answer, rowCallback did the trick!

    Best regards

This discussion has been closed.