Changing javascript search function

Question

I have a working block of Javascript on an html input/search bar. This works perfectly except for one problem:

Right now, it filters by exact matches. So it searches through the divs on the page, and if any of the div and their child tables have a match, it drops all other rows from the table, only leaving the row with a match. But currently it matches the exact string.

This is only an issue because a lot of our items have a hyphen between numbers. So if someone searches 4378-65 it filters what they need, but if they enter 437865 it hides everything because it didn't technically find a match.

Hopefully a simple fix but any help is much appreciated.

The JS:

<script type = "text/javascript">
$(document).ready(function(){
$("#srch-term").keyup(function(){
//For entered search values
// Retrieve the input field text and reset the count to zero
var filter = $(this).val(), count = 0;
var search_regex = new RegExp(filter, "i")

// Loop through the main container as well as the table body and row that contains the match
$(".group-container").each(function(){
    //check if filter matches the group name or description
    var group_name = $(this).children('h3').text()
    var group_description = $(this).children('.uk-text-muted').text()

    if(group_name.search(search_regex)>=0 || group_description.search(search_regex)>=0){ // filter matches
        $(this).show() // show group
        $(this).find("tbody tr").show() // and all children
        return // skip tr filtering
    }

    var no_matches = true

    $(this).find("tbody tr").each(function(){

        // If the list item does not contain the text phrase fade it out
        if ($(this).text().replace('Available','').search(search_regex) < 0) 
{
            $(this).hide();

        // Show the list item if the phrase matches and increase the count by 1
        } else {
            $(this).show();
            count++;
            no_matches = false
        }
    });

    if(no_matches){ // if no tr matched the search either, hide whole group
        $(this).hide();
    }

    });
  });
});
</script>

Answer 1

Presuming the hyphens are unimportant to you (which they appear to be, given the info you provided), essentially all you have to do is remove the hyphens during the comparison, so it essentially ignores their presence:

var filter = $(this).val().replace("-", "");
// ...
var group_name = $(this).children('h3').text().replace("-", "");

Would this work for you?

Answer 2

Maybe this will help:

 // Raw string where you search var raw = 'word-1 43-286 234568 1-s23' // Improved string where hyphen is replaced only in numbers // Just run your search inside this improved string, not with raw var improved = raw.replace(/\\b([\\d]+)\\-([\\d]+)/g, '$1$2') // Returns word-1 43286 234568 1-s23 console.log(improved) // so only hyphen in pure number was removed