Oracle Apex 5 custom report - oracle

Question

in my application I have a form based on a report with the list of Dishes. I want to change apperance of the report so that it doesn't look like a table, but more like a list. I don't want to have a heading. I would expect something similar to the amazon list after you submit your search:
http://www.amazon.com/s/ref=nb_sb_noss_2?url=search-alias%3Daps&field-keywords=oracle+apex
Is it possibe to achieve it without creating a plugin? How would you approach this?

Answer 1

You can do this by creating a new bespoke report template for the report.
Go to Shared Components, Templates and create a new report template. Select "Named Column (row template)" as the template type.
After creating it, edit it and change the "Row template 1" property which initially looks like this:
<tr><td>#1#</td><td>#2#</td><td>#3#</td><td>#4#</td><td>#5#</td></tr>
Replace that with the HTML for each report row, for example:
<li>
<div class="picture">
<img src="#DISH_PICTURE#">
</div>
<div class="description">
<h2>#DISH_TITLE#</h2>
<p>#DISH_DETAILS#</p>
</div>
</li>
The words between #'s are column names from your report query (this template is bespoke for this particular report). So your query might be:
select dish_picture, dish_title, dish_details
from dishes
order by dish_seq;
Use the "Before Rows" and "After Rows" properties to define the HTML before and after the rows, for example <ul class="dishList"> and </ul>.
You can then apply styling using CSS in files or in the page attributes (for example).