Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • pranjal 75 posts 188 karma points
    Jun 05, 2018 @ 11:04
    pranjal
    0

    Umbraco search query highlight in content

    when ever i search any keyword i want that keyword will be highlight in the content

    how to do that any suggestion?

  • pranjal 75 posts 188 karma points
    Jun 07, 2018 @ 10:58
    pranjal
    0

    Issue resolved

    function getUrlVars() {
                var vars = [], hash;
                var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
                for (var i = 0; i < hashes.length; i++) {
                    hash = hashes[i].split('=');
                    vars.push(hash[0]);
                    vars[hash[0]] = hash[1];
                }
                return vars;
            }
    
    
    
            var url = window.location.href;
            var output = getUrlVars();
    
            //var urlParams = new URLSearchParams(window.location.search);
    
            if (output['SE'])
            {
                var searchWord = (output['SE']);
                var regex = new RegExp(searchWord, 'g');
                var text = document.getElementById('searchTextKeywords').innerHTML;
                var newText = text.replace(regex, '<mark>' + searchWord + '</mark>');
    
                document.getElementById('searchTextKeywords').innerHTML = newText;
            }
    
    
        });
    
  • David Amri 214 posts 740 karma points
    Nov 09, 2018 @ 21:11
    David Amri
    0

    Hi Pranjar,

    Would you sheed some light on how this script is working with examine? I’m also looking for a solution to highlight the matched string in the content. How and when are you running this script?

    Best regards

  • ssougnez 93 posts 319 karma points c-trib
    Nov 11, 2018 @ 13:17
    ssougnez
    0

    From what I see, there is a method called "getUrlVars" that is used to retrieve query string from the URL. He places the result of that function in "output" and check if the query string "SE" is defined (I guess after a search, the URL of his page is http://site.com/search?SE=keyword". Then, in the "if", he just uses a regular expression to find all occurrences of the searched keyword and surround them with mark tags.

    Basically, you can put this in your javascript and run the part that do the replacement once your document is loaded.

  • David Amri 214 posts 740 karma points
    Nov 11, 2018 @ 21:04
    David Amri
    0

    Ok, I think I get that. But in order for the script to work and match the string it needs to be loaded in to the dom as the script is on the client side? How is the matched content loaded into the dom and becomes available for the script to run? From what I have found there is no ”out of the box” solution for getting the matched term rendered on the page so how can I then search for it using javascript?

    Really appriciate your help! /David

Please Sign in or register to post replies

Write your reply to:

Draft