Redundant View Templates: 1 For Highlighting Searches, 1 For Browsing

Question

Currently I have 2 different templates to display a product: 1 for general browsing, 1 for search results. This is annoying, I have to manage 2 templates for what is more or less the same layout.

The reason, search results are highlighted. My highlight template looks like this, roughly:

for each result 
  <h2> 
  if search has name 
    <em> result.name </em>
  else
    result.name
  end
  </h2>

  if search has price
    <em> result.price </em>
  else 
    ...
  end
 ...
end

I prefer not to creare a dummy search variable(s) just to use this view with the product's page. I considered building a "display" class that would be prepackaged with the appropriate ems but really this is more of the same, as my product browsing pages then have to unecessarily conform to this class.

I guess the argument can be made that they are 2 different views serving 2 different purposes, yet the fact that I have to manage 2 different files of the same HTML doesn't sit well with me.

Does anyone have a solution and/or take on this?

Answer 1

There can be various approaches to achieve this, for a specific solution please mention frameworks/platforms you are working with.

I can suggest following: a) Split common layout and unique layout in different files and merge them as necessary. So you can have something like - header.html index.html footer.html search.html

Now index.html calls search.html as required. Quite scalable approach.

b) Javascript - You can dynamically generate dom elements on search pages using JS.