JS | Highlight Duplicates in String

Question

Is there a way to highlight (color or bold) duplicates in a string. Applied only to substrings followed by the characters "QD"

PMC.12547QD/25874QD/26548QD/13254QD/45412QD.T05
PMC.12454QD/19457QD/00035QD/25874QD/17354QD.T05
PMC.00025QD/15454QD.T02

all text is located in a textarea.

Highlighting... as per modifying the DOM element in an HTML page, I suppose? You could use another tag. — E_net4, Jul 11 '15 at 21:14
You can't apply different formatting to parts of the text in a textarea. You could accomplish what you're trying to do with regular HTML (using the `contenteditable` attribute if it needs to be editable), but I suggest you solve that problem after you solve the first, which is finding duplicate parts of a string. — Jordan Running, Jul 11 '15 at 21:19
Thank you for your replies. No different formatting in textareas. I'll have to look for another solution. — Ethannn, Jul 11 '15 at 21:23
First let me know do you have code that identify duplicate in string ? is so i can guide alternate way to achieve — Kaushik Thanki, Jul 11 '15 at 21:27
@KaushikThanki No code yet for duplicates. Was hoping to find one here. — Ethannn, Jul 11 '15 at 21:32
ok can i assume that "/" can be use to separate to determine repeated character in word — Kaushik Thanki, Jul 11 '15 at 21:33

Michael Geary · Accepted Answer · 2015-07-11T21:55:09.793

1

This is a fun little problem (finding and marking the duplicates, that is - you'll have to figure out the rest), so I gave it a whirl.

The way I'd do it is in two passes: first to count the number of occurrences of each matched string, and then a second pass to actually wrap the strings. While we're at it, let's make it a general function where you can pass in the match pattern and wrapping strings.

Both passes use input.replace(), but the first pass uses it only for the side effect that it can call a function on each match. This function doesn't even bother returning anything, because the code discards whatever value input.replace() returns.

The second pass does the actual replacements and returns the resulting string.

var testString =
    'PMC.12547QD/25874QD/26548QD/13254QD/45412QD.T05\n' +
    'PMC.12454QD/19457QD/00035QD/25874QD/17354QD.T05\n' +
    'PMC.00025QD/15454QD.T02';

var output = wrapDuplicates( testString, /\d+QD/g, '{', '}' );
console.log( output );

function wrapDuplicates( input, pattern, open, close ) {
    var counts = {};
    input.replace( pattern, function( match ) {
        counts[match] = ( counts[match] || 0 ) + 1;
    });
    return input.replace( pattern, function( match ) {
        return counts[match] > 1 ? open + match + close : match;
    });
}

This logs:

PMC.12547QD/{25874QD}/26548QD/13254QD/45412QD.T05
PMC.12454QD/19457QD/00035QD/{25874QD}/17354QD.T05
PMC.00025QD/15454QD.T02

edited Jul 11 '15 at 21:55

answered Jul 11 '15 at 21:37

Michael Geary

28,450
9
65
75

Hello @MichaelGeary, I will test it and come back with a reply later. Thank you for your help – Ethannn Jul 11 '15 at 21:55
I tested you solution and it works nice. But rather than closing the duplictes in curly braces, I was looking for a solution that doesn't change the format. Thank you for trying! – Ethannn Jul 11 '15 at 22:54
The curly braces were just an example, because you didn't specify what you wanted to do in any kind of detail. You could change them to any string you want. If you want to highlight inside a textarea, you have no other options other than some kind of string wrapping like this. If you want to generate HTML text that you could use outside a textarea, you could simply change the curly braces to HTML open and close tags, e.g. `` and ``. – Michael Geary Jul 11 '15 at 23:08
You mentioned in your own answer that you want to "return the positions or values of duplicates". There was no hint of this in your original question. If you want to get a question answered in a way that meets your needs, you need to specify those requirements in detail. – Michael Geary Jul 11 '15 at 23:09
The question was from the beginning to highlight duplicates. Kaushik asked if I already had the code to return the duplicates. In asnwer to his question I put something together. to return the values and indexes. Hoping this would make it easier to highlight them in some way. – Ethannn Jul 11 '15 at 23:14
As I explained in my original comment to your question, you can't "highlight" *anything* in a textarea, other than adding text. A textarea is plain text by definition. – Michael Geary Jul 11 '15 at 23:16
I noticed you mentioning that but still wanted to answer Kaushiks question. Nevertheless, thanks again for you patience and sharing your knowledge. – Ethannn Jul 11 '15 at 23:20
Sure thing, glad to help. I'm sorry for being a bit snappy in my last couple of comments! Have company coming over for dinner and I was in a bit of a rush. :-) – Michael Geary Jul 11 '15 at 23:22
That's ok Michael, enjoy your dinner! – Ethannn Jul 11 '15 at 23:33

JS | Highlight Duplicates in String

1 Answers1