jquery page refresh not working when cfc function has a <cfinclude>

[paul_8809]

Part of my app provides various email content pages, which are called and populated with data, then prepared for sending through Postmark.

In the following case, when a user shows interest in a job, s/he clicks a button labelled "Chase Job" which ultimate results in an email being sent to the job owner.

When that button is clicked, jQuery handles it as follows:

$('#chase-form .btnChase').on("click",function(e){
   var clickedID = $(this).attr("id");	
   var chase = clickedID.split("_")[1];
   var user_id = clickedID.split("_")[2];
   var listing_id = clickedID.split("_")[3];
   var message = $('#intro-message').val();
   $(this).prop('disabled', true);
      jQuery.getJSON("/cfcs/listing.cfc?method=chaseJob&returnformat=json",{"chase":chase,"user_id":user_id,"listing_id":listing_id,"status":status,"message":message},function(res,code){
      if(res == 1){
         top.location.reload(true);
      }
      $('#chase-form .btnChase').removeAttr("disabled");
   });
   return true;
});

This hits a function in listing.cfc

<cffunction name="chaseJob" access="remote" returnType="any">
   ....
   <cfset res = variables.oUser.SendJobStatusEmail(
      sender_id=arguments.user_id,
      recipient_id=qListing.user_id,
      status=arguments.status,
      listing_id=arguments.listing_id,
      userType=0)>
   ....
   <cfreturn res>
</cffunction>

This, in turn, calls a function in user.cfc

<cffunction name="SendJobStatusEmail" access="remote" returnType="any">
   ... compile some data for an email ...
   
   <!---The following generates a page of html and wraps it in <cfsavecontent>. That <cfsavecontent> is made available to the function by including it here. However, if I do it this way, processing doesn't reach the jQuery page reload --->
   <cfinclude template="/email-templates/template.cfm"> 

   <!---Instead of the above, if I hardcode some html, it DOES allow processing to reach the jQuery reload --->
   <cfset emailBody='<div> <p>Hi there</p> <div>'>
   
   ....
   <cfreturn 1>

Contents of the included template as follows:

<cfsilent>
   ...
   <!--- set variables accessible by the email template, etc --->
   ...

   <cfset page_upload_path = entity_upload_path & "\" & vListingID>

   <!--- create the page dir --->
   <cfif not directoryexists(page_upload_path)>
      <cfdirectory directory="#page_upload_path#" action="create">
   </cfif>

   <!--- load template into savecontent variable. --->
   <cfsavecontent variable="page_content">
      <cfinclude template="template-chase-homeowner.cfm">
   </cfsavecontent>
   <!--- A populated version of the template is now available via "page_content" --->

   <!--- upload the rendered template, to be called later into an email --->
   <cfset randNo = createUUID()>
   <cfset vFile = "#page_upload_path#\#randNo#.cfm">
   <cffile action = "write" 
      file = "#vFile#"
      output = "#page_content#"
      nameconflict = "overwrite">
   </cffile>
</cfsilent>	

<!--- fetch the rendered page and wrap it in cfsavecontent --->
<cfsavecontent variable = "emailBody">
   <cfinclude  template="#viewFile#">
</cfsavecontent>

<!--- "emailBody" is the variable used for the Postmark API call --->

Further processing inside user.cfc simply sends an email

<cfset resPostmark = oSystem.sendPostmarkEmail(
   mailHtml = emailBody
   ... other parameters ...
)>

Can anyone help in understanding the issue, i.e.: Presenting the data inside a cfc using a <cfinclude>, while it works in sending a perfect email, somehow balks the processing, so that it never reaches the jQuery callback directing the page to reload. 

[paul_8809]

Edit: The included template should read 

<cfsavecontent variable = "emailBody">
   <cfinclude  template="#vFile#">
</cfsavecontent>

not

<cfsavecontent variable = "emailBody">
   <cfinclude  template="#viewFile#">
</cfsavecontent>

 I snipped and rearranged code to make it simpler to follow. All the upload and retrieve stuff does work.

[Dave Watts]

That's a lot of nested CFSAVECONTENT and CFINCLUDE tags. If I recall correctly, CFSAVECONTENT basically behaves like CFSET, but allows you to build complex values more easily. I can see that conflicting with CFINCLUDE in ways not easy for me to describe here. Instead of trying that, I recommend you using your browser's Dev Tools to see what's happening with your JavaScript.

[paul_8809]

It became more complicated after Postrmark tightened their data expectations.  Everything now has to be prepared to perfection for it to even reach the Postmark API. And Instead of having masses of email html inside the cfc, I put all the html in templates with data placeholders. Anyway, that's what I've landed with.

I've used the dev tools. The processing is not even returning to the jQuery function as demonstrated by an non-alerting alert() placed directly after the cfc call. I see a "1" in my network response, indicating that the function returned a success code, but it proceeds no further.

[Dave Watts]

Postmark or no Postmark, it's up to you to be able to interact with their APIs. Fortunately, you should be able to disassemble your implementation to fix your jQuery problem. Just work backwards. Take your CFINCLUDEs out of your CFSAVECONTENTs and build a big ol' monolithic CFC for each step and see what happens.

[paul_8809]

It works fine with their API. Sure, that's the obvious fallback solution, rebuild everything. Thanks.

[BKBK]

The line

jQuery.getJSON("/cfcs/listing.cfc?method=chaseJob&returnformat=json",...)

suggests that chaseJob() returns a JSON.

However, that doesn't rhyme with the other parts of the code which say that:

• chaseJob() returns res;
• res results from the call variables.oUser.SendJobStatusEmail(), which has return-value 1;
• hence chaseJob() returns 1.

[China-Buy_com]

I tried removing returnformat=json, with no change. Anyway the code has always worked with res=1 in this and other functions using the same jQuery call. It works if I hardcode the html. It just stopped working as soon as I tried the <cfinclude>. Again, the cfc function "chaseJob()" performs its task using the <cfinclude>. It just seems that the <cfinclude> somehow stops jQuery seeing/receiving the return.

[paul_8809]

Sorry, that was me (Paul) on that last reply. Not sure what happened there

[BKBK]

... the cfc function "chaseJob()" performs its task using the <cfinclude>. It just seems that the <cfinclude> somehow stops jQuery seeing/receiving the return.

By @China-Buy_com

OK. Could you show us the code that template-chase-homeowner.cfm contains?

[paul_8809 · Accepted solution]

You were on the right track with that. I found the problem. I started changing things around to get the code out of the page-generator and into the cfc to avoid the cfinclude. Then I realized that I had a "<cfajaximport>" tag at the top of the included file. I remove it and the original code worked fine. Thanks so much for the help. Sorry, I feel like I wasted people's time as I didn't show this in my original post.  

[Dave Watts]

This is good, though! Everyone has defects or mistaken assumptions in their code. This way, you identified one in yours and publicly documented it here! I wish I'd done that more often, myself.

[BKBK]

Hi @paul_8809 , Thanks for the update and for sharing your solution.