Refresh Coldfusion page that is included within HTML page

Discussion in 'Programming' started by webnutrition, Oct 20, 2008.

  1. #1
    I have a .cfm page that I have included within all my .htm pages on my website. The .cfm page queries a database and outputs the number of items in the shopping cart. The .cfm page is not refreshing when you go throughout the site to different pages. You have to hit the refresh button on the browser in order to get the correct number of items to show. Is there any way to get the .cfm page to refresh for every page that is loaded?

    Here is how it is currently set up:

    The .htm pages:
    <table>
    <tr>
    <script src="cartcontents.cfm"></script>
    </tr>
    </table>

    cartcontents.cfm:
    <cfcontent type="application/x-javascript; charset=utf-8">
    <cfsetting showdebugoutput="no">

    <cfset subtot = 0>
    <cfset itemsincart = 0>
    <cfquery datasource=wlg name=cartcontents>
    SELECT *
    FROM products
    WHERE cfid = #session.cfid# and cftoken = '#session.cftoken#'
    </cfquery>


    <cfoutput query=cartcontents>
    <cfset tot = #productprice# * #quantity#>
    <cfset subtot = #subtot# + #tot#>
    <cfset itemsincart = #itemsincart# + 1>
    </cfoutput>
    <cfoutput>
    document.writeln('<td height="20" valign="bottom" align="left">Items: <span >#itemsincart#</span></td>');
    document.writeln('</tr>');
    document.writeln('<tr>');
    document.writeln('<td height="20" valign="top" align="left">Amount: <span >$#NumberFormat(subtot,'_.__')#</span></td>');
    </cfoutput>
     
    webnutrition, Oct 20, 2008 IP
  2. robhustle

    robhustle Peon

    Messages:
    98
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I used this hack for a similar situation. I had dynamic CSS that would not refresh when I included it via src tag. I switched up to the method below, and it started updating immediately.

    Instead of:

    <script src="cartcontents.cfm"></script>

    Try this:

    <script language="JavaScript" type="text/javascript">
    <cfinclude template="cartcontents.cfm">
    </script>

    Not sure if it will work for your JS. Give it a try and see if it works for you.

    pz.
     
    robhustle, Oct 20, 2008 IP
  3. dshuck

    dshuck Peon

    Messages:
    92
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    For whatever it is worth, I suggest you shift your thinking about this just a bit. Instead of reloading all your JS including previously outputted view information, what you are really wanting to do is update the amount right? Then just updated the amount!


    Put your HTML in your page like this:
    <td height="20" valign="bottom" align="left">Items: <span id="ItemCount">#itemsincart#</span></td>

    Then use Ajax to update #ItemCount. For example, have a page like "getItemCount.cfm" that will only return the count of items in the session. (make sure to reset your content and strip white space!) Then using JQuery, you could simply do something like this:

    <script>
    $("#ItemCount").load("getItemCount.cfm");
    </script>

    If you want to take it a step further, have it return both the ItemCount and SubTotal in a JSON struct (see SerializeJSON() in CF docs) and then make a single Ajax request to update your view.
     
    dshuck, Oct 21, 2008 IP