Need help listing products in reverse order in old ColdFusion site

Question

I have been tasked with re-ordering all the items displayed on a website with the newest products(highest number code) first. Currently they are listed in entry order. The codes will start with a single or a double letter and then be following by a numerical value (ie 001-1200)

This is the current base page with the code to display the range and category, I believe the website/code is about 15 years old......

Thanks in advance

<div id="content">
    <cfinclude template="../core_includes/top_menu.cfm">
    <div id="template_box2">
        <table cellspacing="0" cellpadding="0" border="0">
        <tr>
        <td valign="top">
            <cfinclude template="../core_includes/left_menu.cfm">
        </td>
        <td valign="top">
        <div id="template_right">
            <div id="template_right_topbar"></div>
            <div id="template_right_content" <cfif products.recordcount eq 0>style="height:480px;"</cfif> <cfif products.recordcount lte 24>style="height:480px;"</cfif>>
                <div style="padding-bottom:10px;">
                    <span class="template_header1"><cfoutput>#range.range_name#</cfoutput></span>
                </div>
                <div style="padding-bottom:12px;">
                    <span class="template_header5"><cfoutput>#category.category_name#</cfoutput></span>
                </div>
                <div <cfif products.recordcount eq 0>style="padding-top:14px;"</cfif>>
                <cfif products.recordcount gt 0>
                <cfoutput query="products">
                    <a href="index.cfm?content=product&range_id=#range.range_id#&category_id=#category.category_id#&product_id=#products.product_id#" target="_self" alt="#products.code#"><img src="#products.image_1_thumb#" width="88" height="88" border="0" alt="#products.code#" title="#products.code#" style="margin-right:4px;margin-bottom:3px;border: 2px solid ##484848;"></a>
                </cfoutput>
                <cfelse>
                <span class="template_header2">There are currently no products in this category. Please <a href="mailto:*.*">email us</a> for more information.</span>
                </cfif>
                </div>
            </div>
            <div id="template_right_bottombar"></div>
        </div>
        </td>
        </tr>
        </table>
    </div>
    <cfinclude template="../core_includes/footer.cfm">
</div>

Answer 1

Solution 1

Change the sort order in the query so that it is in the correct order. This is a far better solution than Solution 2

Solution 2

Loop over the query backwards.

I have separated the link into parts to make it more legible. The newlines need to be removed.

<cfoutput>
    <cfloop from="#products.recordcount#" to="1" step="-1" index="i">
    <a href="index.cfm?content=product
        &range_id=#range.range_id#
        &category_id=#category.category_id#
        &product_id=#products.product_id[i]#" target="_self" alt="#products.code[i]#">
        <img src="#products.image_1_thumb[i]#" width="88" height="88" border="0" 
            alt="#products.code[i]#" 
            title="#products.code[i]#" style="margin-right:4px;margin-bottom:3px;border: 2px solid ##484848;">
    </a>
    </cfloop>
</cfoutput>

See: https://cffiddle.org/app/file?filepath=ba42a3e2-0048-429d-a2a7-ba39ee0583d0/1d34048f-37d2-4320-9240-d601c107eefc/2a6a3a73-3388-4fc7-91e3-7387156945c1.cfm

Solution 2 improved

The data also needs to be properly encoded

<cfoutput>
    <cfloop from="#products.recordcount#" to="1" step="-1" index="i">
    <a href="index.cfm?content=product
        &range_id=#EncodeForURL(range.range_id)#
        &category_id=#EncodeForURL(category.category_id)#
        &product_id=#EncodeForURL(products.product_id[i])#" target="_self" alt="#EncodeForURL(products.code[i])#">
        <img src="#EncodeForHTMLAttribute(products.image_1_thumb[i])#" width="88" height="88" border="0" 
            alt="#EncodeForHTMLAttribute(products.code[i])#" 
            title="#EncodeForHTMLAttribute(products.code[i])#" style="margin-right:4px;margin-bottom:3px;border: 2px solid ##484848;">
    </a>
    </cfloop>
</cfoutput>

Solution 3

If you have CF 2018 update 5 or higher

<cfset products = products.reverse()>
<cfoutput query="products">
   <a href="index.cfm?content=product&range_id=#range.range_id#&category_id=#category.category_id#&product_id=#products.product_id#" target="_self" alt="#products.code#"><img src="#products.image_1_thumb#" width="88" height="88" border="0" alt="#products.code#" title="#products.code#" style="margin-right:4px;margin-bottom:3px;border: 2px solid ##484848;"></a>
</cfoutput>

See: https://cffiddle.org/app/file?filepath=d76a0186-c61e-47ff-8a1b-1c1cf2a04778/4034ffbe-8595-4404-9fbb-bc0bcf8e2b7d/85e6c023-4ab8-40f2-8f8e-f7a68b6297a8.cfm