6

So I'm making a search function for comments. Someone else here helped me with the SQL query. What I also want to do is to highlight the search query text in the results.

The results are stored as HTML inside a $variable. How can I wrap the search query text inside a <span> tag for example, without messing up the html.

for eg. the search query can be foo bar and the output can look like:

<p>bla bla foo bar bla</p>

so it should be something like:

<p>bla <span class="highlight">foo bar</span> bla bla</p>
Community
  • 1
  • 1
Alex
  • 66,732
  • 177
  • 439
  • 641

7 Answers7

7

Simple find and replace:

$resultHTML = str_replace($searchString, '<span class="highlight">'.$searchString.'</span>', $resultHTML );
jd.
  • 4,057
  • 7
  • 37
  • 45
2
<?php

$result = "<p>Bla bla foo bar bla bla test x x x</p>";

$query = "foo bar";

// The important point here is, USE single quote ( ' ) in replacement part!!
echo preg_replace( "/($query)/", '<span class="highlight">${1}</span>', $result );
Bnymn
  • 147
  • 1
  • 2
  • 8
  • 1
    You can use double quotes too, just gotta escape 'em. For more info - http://en.wikipedia.org/wiki/Escape_character – tomsseisums Dec 14 '10 at 21:27
1
$searchString = 'foo bar';
$searchResult = '<p>bla bla foo bar bla</p>';

var_dump(str_replace($searchString, '<span>'.$searchString.'</span>', $searchResult));

var_dump(preg_replace('/'.$searchString.'/', '<span>'.$searchString.'</span>', $searchResult));
Poelinca Dorin
  • 9,577
  • 2
  • 39
  • 43
1

If you make sure that the search term itself does not contain any HTML, you can go straight ahead and wrap it it in "<span>" with the help of str_replace().

Note that this is one of the very rare occasions where dealing with HTML via string functions is not bad per se.

If the search term can contain HTML (i.e. the highlight can span over tag borders), things get a lot more complicated and you won't get away with a clever shortcut like the one above.

Tomalak
  • 332,285
  • 67
  • 532
  • 628
  • 1
    well there's another problem. for eg. the output can have ``, then the markup breaks up.. – Alex Dec 14 '10 at 20:51
  • @Alex: This is true, and it's exactly the reason why using basic string manipulation is generally considered a no-no for working with HTML. It depends a lot on your data if this simplistic approach is viable or not. If the comment can contain *any* HTML, you are in the "a lot more complicated" corner very fast. – Tomalak Dec 14 '10 at 22:27
1

I think this is more complicated than it looks. If we are searching for foo bar then

<p>bla bla foo bar bla</p>

will be converted into

<p>bla <span class="highlight">foo bar</span> bla bla</p>

but what about some special cases? It could be that foo bar is matched inside an HTML tag:

<p>bla bla <span class="foo bar">foo bar</span> bla</p>

which will be replaced as

<p>bla <span class="<span class="highlight">foo bar</span>">foo bar</span> bla bla</p>

Am I right with this? I haven't been into this issue, but I'd recommend you checking on CakePHP's docs (yeah, I know you are not using the framework--) in the Text helper, the highlight() method which handles HTML tags correctly. Take a look at the source, give it a shot and if it works for you, go ahead and copy it.

metrobalderas
  • 5,180
  • 7
  • 40
  • 47
  • 1
    yes, that situations can occur. I should have mentioned that in the question. anyway I found a easier solution, using jQuery! :D – Alex Dec 14 '10 at 21:24
0

text-shadow: 1px 1px 1px #FCD600;

Wynn
  • 183
  • 1
  • 2
0

I had the same question but I found this

The code is built to randomly change highlight colors, but this is done through a function, so it is easy to modify to use one color:

     $color = '#FCB514'; //self::generate_colors();

First Post!

DanielJRobles
  • 33
  • 9