Hi,

I am breaking up a string using regex (see here: https://regex101.com/r/mGdwOQ/1). I am then trying to do a .filter() for certain elements based on the entered criteria.

How can I use .filter() to look for multiple values in both the data-label and data-value attributes?

.aspx page:

1. <span data-label="name" data-value="<%# DataBinder.Eval(Container.DataItem, "Name") %>"><%# DataBinder.Eval(Container.DataItem, "Name") %></span>
   <span data-label="date" data-value="<%# DataBinder.Eval(Container.DataItem, "Date") %>"></span>
   <span data-label="status" data-value="<%# DataBinder.Eval(Container.DataItem, "Status") %>"></span>
   

JS:

1. const regex = /(name|date|status|location|title|department)(?:\s*([<>:]{1,2})(?:\s*))((?:(?!\b(?:and|or)\b).)+)(?:\b(and|or)\b)?/g;
   const str = $( "#Search_Text" ).val().toLowerCase();
   let result;
2. var keys = [];
   var values = [];
3. while( result = regex.exec( str ) ) {
4.  var key = $.trim( result[1] );
    var value = $.trim( result[3] );
    console.log( "span[data-label='" + key + "'][data-value='" + value + "']" );
    
    keys.push( key );
    values.push( value );     
    
   }
5. $( ".content .tile" ).filter( function() {
6.  $( this ).toggle( $( this ).find( "span[data-label='" + ??? + "']" ).data( "value" ).toLowerCase().indexOf( ??? ) > -1 );
    
   } );
   

Also, if the value is entered with an ! I want it to be not equals. So the idea is that somebody can type in:

name: joe, jill, !john and date: xx/yy/zz

and the results would change to show any 'tile' who data-label=name element has data-value= any of the names (i.e. joe, jill but not john) and where the data-label=date element has data-value of the entered date.

Thanks!