Have Datatables come up with an Exclude field yet?

Have Datatables come up with an Exclude field yet?

spacemancwspacemancw Posts: 31Questions: 9Answers: 0
edited October 2023 in Free community support

Is there and exclude field for DataTables?
Datatables is fantastic for searching tables. But sometime you get more results than you need to it is necessary to exclude some key word or words, so that you can exclude rows. Actually it would be nice to be able to search for multiple words and exclude multiple words.

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    For that level of control over the search, it's worth looking at SearchBuilder. There, you have complete control over searches that can be made, for example with strings you can choose "Does not contain", "Does not start with", etc., and you can create additional search conditions if the provided ones are not comprehensive enough.

    Colin

  • allanallan Posts: 63,451Questions: 1Answers: 10,465 Site admin

    It isn't ready for release yet, but DataTable 2's smart filter has been updated to include a negative match - similar to Google you can add a ! before a string to make it a negative search.

    Planning for a beta this month (October).

    Allan

  • spacemancwspacemancw Posts: 31Questions: 9Answers: 0

    Allan thanks for the reply.
    Just to complicate matters .... will you have a way to search for multiple items in the search field while also excluding multiple items in the exclude field?

    I have both of these functions working with java script, but I could never get them working with DataTables. I can only get them to work with a HTML table without pagination. This is not very pretty with big tables with thousands of rows, but it works.

    Here is the code.

    // Debounce for search
    const debounce = (funct, time) => {
        let timeoutId;
        return function() {
            if(timeoutId) {
                clearTimeout(timeoutId)
            }
            const context = this
            const args = arguments
            timeoutId = setTimeout(() => {
                funct.apply(context, args)
            }, time);
        }
    }
    
    //Search and Exclude Input fields
    
    function myFunctionS() {
      var input, filter, table, tr, td, i, txtValue;
      input = document.getElementById("myInputS");
      inputExclude = document.getElementById("myInputExcludeS");
      filter = input.value.toUpperCase();
      filterExclude = inputExclude.value.toUpperCase();
      table = document.getElementById("example");
      tr = table.getElementsByTagName("tr");
      for (i = 0; i < tr.length; i++) {
        td = tr[i].getElementsByTagName("td")[0];
        if (td) {
          txtValue = td.textContent || td.innerText;
          txtValue = txtValue.toUpperCase()
          let match = true
          let f = true // add this line
          filter.split(' ').forEach(q => {
            if(q && q.length > 0) {
              // and add these lines
              if(f) {
                match = false
                f = false
              }
              match = match || txtValue.indexOf(q) > -1  /// only change && instead ||
            }
         })
          filterExclude.split(' ').forEach(q => {
            if(q && q.length > 0)
              match = match && txtValue.indexOf(q) == -1
          })
          if (match) {
            tr[i].style.display = "";
          } else {
            tr[i].style.display = "none";
          }
        }
      }
    }
    
    //
    //
    //
    

    and this is what I put in html

    <input type="text" id="myInputS" onkeyup="debounce(myFunctionS(), 500)" placeholder="Search for names..">
    <br>
    <input type="text" id="myInputExcludeS" onkeyup="debounce(myFunctionS(), 500)" placeholder="Excludes names.."/>
    
    

    The first cell in the row contains the data from all the other rows, but it is hidden and not displayed, and the search/exclude works on that cell.

    The first cell looks like this,

    <td style=display:none;>cell1-data cell2-data cell3-data cell4-data  ... etc </td>
    

    I could have data that looks like this:

    Type Name Client
    Router NY-rtr01 ABC
    Router TX-rtr01 XYZ
    Router SF-rtr01 DEF
    Switch NY-sw01 DEF
    Switch SF-sw01 ABC
    WifiAP TX-ap01 DEF
    WifiAP SF-ap01 XYZ

    Search for router and WifiAP
    Router NY-rtr01 ABC
    Router TX-rtr01 XYZ
    Router SF-rtr01 DEF
    WifiAP TX-ap01 DEF
    WifiAP SF-ap01 XYZ

    Search for router and WifiAP, exclude NY, TX

    Router SF-rtr01 DEF
    WifiAP SF-ap01 XYZ

    It doesn't work with Datatables because it only works on the data that is on the page, so if u have 10.000 rows, and only showing 50 at a time with pagination, it only works on those 50.

  • allanallan Posts: 63,451Questions: 1Answers: 10,465 Site admin
    Answer ✓

    Sounds like you are using client-side search with server-side pagination.

    DataTables when in client-side processing mode will perform search on all rows that you have in the table. If it is in server-side processing mode then all search operations will be done at the server-side. You cannot mix processing modes. There is an overview of them available here.

    If you were to use the new DataTables 2 client-side smart filter you could use WifiAP !NY !TX for the search. Although it sounds like you want an "OR" expression in there. Without regex that that isn't an option in the smart filter. For more complex searches like that, use SearchBuilder as Colin mentioned above.

    Allan

Sign In or Register to comment.