Skip to main content
Inspiring
November 30, 2007
Answered

Change result of <cfinclude> without page refresh.

  • November 30, 2007
  • 6 replies
  • 1443 views
Is there a simple way to change the result of a <cfinclude> without refreshing the page. I have a page that needs to display one of several <cfinclude>'s based on which button is clicked. For our purpose here let's assume there are 6 buttons and 6 different <cfinclude>.'s. I'm thinking some sort of ajax panel update, but I don't know ajax, nor can I use ASP.Net.

    This topic has been closed for replies.
    Correct answer Newsgroup_User
    All of what Adam says, with a couple more examples of what I think you
    are trying to do.

    You could include all your <cfinclude...> code each in an identifiable
    block element such as a <div...>. Then using JavaScript and DHTML
    effects you could hide and show different divs based on the user
    interaction with given controls such as buttons. This would work well
    if the content of all the divs are relativly small and static. If they
    are large enough where downloading all of them would have in impact on
    load time or dynamic so that the content displayed in each section needs
    to be up to date at the moment a control is selected this option will
    not work well.

    In that case, one will need to had some kind of dynamic refreshing such
    as AJAX or pipe-lines. This adds an dimension to the DHTML aspects of
    your interface to make new request from the server before the content of
    the browser is updated.

    Before going into more detail and the hows and whys of each of these it
    would be helpful to know more about your exact requirements and comfort
    level with various technologies and techniques.

    As Adam concluded there are many ways to solve this type of problem.

    6 replies

    December 3, 2007
    No... you gave the right information, you're just not understanding the answer.

    <CFINCLUDE> statements are processed on the server before your page is displayed. It won't be re-executed on your browser because it doesn't exist at the browser level - only the content of your template exists. To change the content, you would need to re-invoke the server by re- submitting the page.

    If you're set on using <CFINCLUDE> statements, set up several invisible <DIV> statements within your HTML like <div name="a" style="display:none"><cfinclude template="abc.cfm" /></div>

    Then when your users click a button you can either change the style using JavaScript - like: document.getElementById("a").setAttribute("style","display:block");

    ... or... you can literally copy the contents of the invisible div into a visible one.
    Something like this:
    (HTML:)
    <table><tr><td><div id="b"></div></tr></table>
    <div name="a" style="display:none"><cfinclude template="abc.cfm" /></div>

    (JavaScript:)
    document.getElementById("b").innerHTML = document.getElementById("a").innerHTML;

    ghouserAuthor
    Inspiring
    December 1, 2007
    Obviously I was remiss in giving complete info. Sorry about that. What I have is a table cell on a page in which I need to diplay the contents of a <cfinclude>. The content of this single cell needs to change based on a button click elsewhere on the page. Such as: <cfinclude template = "file1"> or <cfinclude template = "file2"> and so on.
    Newsgroup_UserCorrect answer
    Inspiring
    November 30, 2007
    All of what Adam says, with a couple more examples of what I think you
    are trying to do.

    You could include all your <cfinclude...> code each in an identifiable
    block element such as a <div...>. Then using JavaScript and DHTML
    effects you could hide and show different divs based on the user
    interaction with given controls such as buttons. This would work well
    if the content of all the divs are relativly small and static. If they
    are large enough where downloading all of them would have in impact on
    load time or dynamic so that the content displayed in each section needs
    to be up to date at the moment a control is selected this option will
    not work well.

    In that case, one will need to had some kind of dynamic refreshing such
    as AJAX or pipe-lines. This adds an dimension to the DHTML aspects of
    your interface to make new request from the server before the content of
    the browser is updated.

    Before going into more detail and the hows and whys of each of these it
    would be helpful to know more about your exact requirements and comfort
    level with various technologies and techniques.

    As Adam concluded there are many ways to solve this type of problem.
    Inspiring
    November 30, 2007
    On Fri, 30 Nov 2007 16:13:26 +0000 (UTC), ghouser wrote:

    > Is there a simple way to change the result of a <cfinclude> without refreshing
    > the page. I have a page that needs to display one of several <cfinclude>'s
    > based on which button is clicked. For our purpose here let's assume there are
    > 6 buttons and 6 different <cfinclude>.'s. I'm thinking some sort of ajax
    > panel update, but I don't know ajax, nor can I use ASP.Net.

    Based on what you're asking, there's a fundamental gap in your
    understanding of how CF works. No offence intended.

    CF code - all of it - runs on the CF server, and it never has *any*
    interaction with the client browser. So a sentence trying to link
    "<cfinclude>" and "browser refresh" makes no sense.

    The (simplified) sequence of events is:

    Client browser makes a request to an address
    The web server listening at that address receives the request
    The CF plug-in in web server instructs the web server to pass CFM and CFC
    requests to the CF server (via JRun)
    CF server processes the request, parsing the CFML of the calling template
    (including any <cfinclude> tags), and compiles it to Java byte code
    CF passes this to the JRun server to execute, which it does, and generates
    some output (usually HTML).
    JRun passes this back to the web server (possibly via the CF server, but I
    suspect not, and this is irrelevant anyhow).
    The web server passes this back to the client browser
    The client browser renders it.

    Each of those steps has communications in one direction, and only between
    adjacent steps. CF never talks to the browser, and it does not know about
    "refreshes". A <cfinclude> is only part of a composition which comprises
    the code that is executed on the CF/JRun server, so a refresh on the
    browser can never pick and choose a specific <cfinclude> call.

    So what you're asking is a non sequitur.

    You need to make your request change in some way for each desired response
    (the differences being in the CF template you're including), and then have
    some logic in the template that has the <cfinclude> tags based on the
    changes in the request. The easiest way to change the request is by using
    parameters on the query string, or by submitting form values.

    For query string parameters, something like:

    index.cfm?whichoption=red

    And then in the index.cfm

    <cfswitch expression="#URL.whichOption#">
    <cfcase value="red">
    <cfinclude template="./red.cfm">
    </cfcase>
    <cfcase value="etc">
    <cfinclude template="./etc.cfm">
    </cfcase>
    </cfswitch>

    Or any of an innumerable other options, given your requirements.

    --
    Adam
    ghouserAuthor
    Inspiring
    November 30, 2007
    Yes, iFrames could do essentially the same thing, I've used them before many times. But with them, as far as I know, you must specify the height and width of the static frame. I would like to avoid this if possible.

    Plus, the code I am including is NOT complete pages. Which means I don't get meta tags, body attributes, and so on.
    Inspiring
    November 30, 2007
    Frames or iframes might work.