ColdFusion How can I indent my table results with related records?

Posted on 2014-02-01
Last Modified: 2014-03-01
How can I indent my table results:

                                        Search results:
                                                                           Ordered 40  Received 45
                      (show related records                    Overage   Return 5
                         under main record with indent)                            

How can I implement a + for the viewer to click, to view the related records? (normally hidden)
Question by:DJPr0

Assisted Solution

by:Jack Leach
Jack Leach earned 100 total points
ID: 39826737
I haven't used ColdFusion with an Access database, and am unsure quite how those two work together, but what you're suggestion sounds like a Treeview control.  Have you looked into one?  ASP.NET has a nice implementation of a web-hostable treeview, but I'm unsure of others offhand.

Accepted Solution

Rodrigo Munera earned 400 total points
ID: 39828669
It's pretty simple, and usually handled with CSS and possibly jQuery.

I'm assuming you're starting with a query? When you're outputting the query data you would want to group the data and tag the sub-data with a named class or set of classes. A table might not be your best way of displaying this data since the data might not be tabular in nature.

So, let's say you have a query with customers and their orders. Each customer has a unique customer ID and each order has a unique order ID, your query would order the data by customerID and then by orderID. then you can nest your outputs by group and hide/show them on demand.

<!-- Make sure you have a query library in the <head> of your document for the .toggle() function to work -->
  <cfoutput query="orders" group="CustomerID">
    <tr><td>#customerID# #name# etc... <button onclick="$('##Customer_#CustomerID#').toggle();"> + </button></td></tr>
      <cfoutput group="OrderID">
        <tr id="Customer_#CustomerID#" class="hidden"><td>#OrderID# #OrderDate# etc...
          <cfoutput group="OrderItems">
            <div><td>#itemID# #Units# #Total# etc...</td></div>

Open in new window


Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Phishing attempts can come in all forms, shapes and sizes. No matter how familiar you think you are with them, always remember to take extra precaution when opening an email with attachments or links.
Preparing an email is something we should all take special care with – especially when the email is for somebody you may not know very well. The pressures of everyday working life stacked with a hectic office environment can make this a real challen…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Access reports are powerful and flexible. Learn how to create a query and then a grouped report using the wizard. Modify the report design after the wizard is done to make it look better. There will be another video to explain how to put the final p…

685 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question