Dynamic "real-time" site search - tagging best practice



We are implementing a new real-time site search box on our pages.


Previously we've had a search box where you type a word, press enter (or the icon) and then the search results appear on a new page. We have used a prop to collect the search terms and all was well.


The new set up will see users start to type their word, and results will start to appear based on each key stroke they make, with no need to click enter. We can change the minimum key strokes to what we want, currently set to 3 I think before results start to appear. I have no idea how to tag this. Dev team has tried using a prop like before, but of course this will fire with every key stroke (so if someone wanted to search for "dental", I would start getting results at "den", then again at "dent", then again at "denta"...depending on how much a user types. You get the picture. Not sure how beneficial this would be in terms of insight?! 


Is there a better way to tag this?! I am stumped. Thanks in advance 🙂

Accepted Solutions (0)

Answers (2)

Answers (2)



Can you fire the tag on the onchange event of the input tag that is your search text box?  Then the tag would fire once the user leaves the the text box.




As an option, consider capturing the value at click rather than at every new character entry.