CODEWITHSUNDEEP
jqueryregexkendo-ui
gardarvalur
gardarvalur

Reputation: 1585

Match strings with regex while ignoring certain character

I need to compare two strings in a loop while accepting a certain character "-" within the matching string.

function onDatabound(e) 
{
    var grid = e.sender;
    var str = $.trim(grid.value());
    var srcWords = str.split(" ");
    var records = $(grid.ul).find("li");
    for (var i = 0; i < records.length; i++) {
        var classes = $(records[i]).find("span i").attr("class");
        var newText = records[i].innerText;
        for (var j = 0; j < srcWords.length; j++) {
            var regex = new RegExp(srcWords[j], 'gi'); //case-insensitive
            newText = newText.replace(regex,
                function(match) {
                    return '<strong>' + match + '</strong>';
                });
        }
        $(records[i]).find("span").html("<i class='" + classes + "'></i>" +  newText);
    }
}

This code works perfectly but it needs the final touch. I need the replace-function to also accept inputs from users even if they don´t write the character "-". Example:

innerText: 1111-2222 lorem ipsum dolar 11112222 lorem ipsum dolar

User input: 11112222

I need both of these to be highlighted "1111-2222" and "11112222" even though the user wrote without the "-" or vice versa.

Should I use the regular expression to solve this or do you guys see any other method for me to use?

Upvotes: 1

Views: 49

Answers (1)

Wiktor Stribiżew
Wiktor Stribiżew

Reputation: 627282

While you are building the regex dynamically, it makes sense to insert an optional hyphen between each char.

You may build the pattern using

var regex = new RegExp(srcWords[j].split("").join("-?"), 'gi');

Here is a sample demo of the regex.

With escaping special chars:

var regex = new RegExp(srcWords[j].split("").map(function(s) { 
  return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
} ).join("-?"), 'gi');

Note you do not need an anonymous callback method in the replacement to replace with the whole match, you may use a plain $& string backreference:

newText = newText.replace(regex,'<strong>$&</strong>');

See Difference between $1 and $& in regular expressions

JS demo:

var newText = "1111-2222 and 11112222";
var srcWords = "11112222";
var regex = new RegExp(srcWords.split("").map(function(s) { 
  return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
} ).join("-?"), 'gi');
console.log( newText.replace(regex,'<strong>$&</strong>') );

Upvotes: 1

Related Questions