Solved

Returning a variable after using ColdFusion.Ajax.submitForm and a CFC

Posted on 2009-03-30
4
665 Views
Last Modified: 2013-12-24
I am new to using ajax and also not very saavy with Javascript either.  I have a form that I want to submit using the ColdFusion.Ajax.submitForm function and replace the form with a simple text message saying "Thank you!". I'll include clips from both my form page and also the cfc that's being called.  The data is inserting, but I can't get a response to return (at least not in a format I can recognize. Thanks!
head of form page...
 
<script type="text/javascript">
          function doInsertStats() {
 
        ColdFusion.Ajax.submitForm('insertForm', 'queries.cfc?method=insertstats');
              
      }
</script>
 
***************************************************************************************************
 
 
function in the queries.cfc page...
 
<cfcomponent displayname="Queries">
 
	<cffunction name="insertstats" access="remote" output="false" returntype="string">
	
 
	      <cfargument name="formname">
	      <cfargument name="formname">
	      <cfargument name="formname">
                     
 	            
                  <cfquery name="InsertStats" datasource="#datasource#">
            
insert into ExampleTbl( column1, column2,  column3 )
	            values (
	
	                  <cfqueryparam cfsqltype="cf_sql_varchar" value="#formvalue#">,
	                  <cfqueryparam cfsqltype="cf_sql_varchar" value="# formvalue#">,
                                        <cfqueryparam cfsqltype="cf_sql_varchar" value="# formvalue#">
 
	                        )
				
	cfset ExampleComplete = "1">	
 
	</cfquery>
	
	   <cfreturn ExampleComplete>
	      
	</cffunction>
	
</cfcomponent>

Open in new window

0
Comment
Question by:scripkilla
  • 2
  • 2
4 Comments
 
LVL 13

Expert Comment

by:srikanthmadishetti
ID: 24022418
First thing why  are you keeping <cfset> statement in <cfquery>  remove that you don't need


<cfset statement at all

second thing

ColdFusion.Ajax.submitForm has two more parameters which are java script  functions , first one which executes if there are no erros and second if there are erros.

see the below examples.


  arguments are form name, cfc and method to send form values to, javascript function to handle result,
       javascript function to handle error
      */
      ColdFusion.Ajax.submitForm('insertForm', 'employeeService.cfc?method=insertData', resultInsertHandler, insertErrorHandler);

so here your statement will become like following

 function doInsertStats() {
 
        ColdFusion.Ajax.submitForm('insertForm', 'queries.cfc?method=insertstats',resultInsertHandler, insertErrorHandler);
             
      }




function resultInsertHandler(text) {

     
        var message ="Thank you!";
        var resultDiv = document.getElementById("result");
       
       
        resultDiv.innerHTML = "<p>"+message+".</p>";
               
   
       
}

   
    function insertErrorHandler(id, message) {


        var resultDiv = document.getElementById("result");
       
        resultDiv.innerHTML = "<p>Unsuccessfull</p>";
   
    }
   

at the bottom of ur code where u want to dipaly message create a div with id result

<div id = "result">

</div>


or else you can keep just alert statements in respective jaav script functions let me know if you need furthur help

0
 
LVL 13

Accepted Solution

by:
srikanthmadishetti earned 125 total points
ID: 24022668
Change your code like this


head of form page...
 
<script type="text/javascript">
          function doInsertStats() {
 
        ColdFusion.Ajax.submitForm('insertForm', 'queries.cfc?method=insertstats',resultInsertHandler, insertErrorHandler);
             
      }
     
      function resultInsertHandler() {
   

        var resultDiv = document.getElementById("result");
       
        resultDiv.innerHTML = "<p>Thank you!.</p>";
       
       

   
    }
   
   
    function insertErrorHandler(id, message) {
   
       alert("Error while updating\n Error code: "+id+"\n Message: "+message);

        var resultDiv = document.getElementById("result");
       
        resultDiv.innerHTML = "<p>Insert unsuccesfull.</p>";
   
    }
   

   
</script>
 
***************************************************************************************************
 
 
function in the queries.cfc page...
 
<cfcomponent displayname="Queries">
 
        <cffunction name="insertstats" access="remote" output="false"  returntype="void">
       
 
              <cfargument name="formname">
              <cfargument name="formname">
              <cfargument name="formname">
                     
                   
                  <cfquery name="InsertStats" datasource="#datasource#">
           
insert into ExampleTbl( column1, column2,  column3 )
                    values (
       
                          <cfqueryparam cfsqltype="cf_sql_varchar" value="#formvalue#">,
                          <cfqueryparam cfsqltype="cf_sql_varchar" value="# formvalue#">,
                                        <cfqueryparam cfsqltype="cf_sql_varchar" value="# formvalue#">
 
                                )
                               
       
 
        </cfquery>
       
         
             
        </cffunction>
       
</cfcomponent>




<!---add this in u form page  to display result --->
    <div id="result">
    </div>


0
 
LVL 1

Author Comment

by:scripkilla
ID: 24029412
I think we are really close, thank you for explaining it so well.  When I click on the form submit button, I am getting the Object Expected JS error on line 286.  This is the that calls the function...

<input type="button" value="Submit" onclick="DoInsertStats()" >

any thoughts?
0
 
LVL 1

Author Comment

by:scripkilla
ID: 24029439
Nevermind, I had an uppercase 'D'oInsertStats() - problem solved.  Thanks!!
0

Featured Post

Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
wordpress limitations 4 124
AWS Advice on using WHM/cPanel 1 80
.dwt files not viewable in browser - why? 2 103
How code a 301 redirect for folder files -> 1 file 2 58
Periodically we have to update or add SSL certificates for customers. Depending upon your hosting plan you may be responsible for the installation and/or key generation. In the wake of Heartbleed many sites were forced to re-key. We will concen…
Meet the world's only “Transparent Cloud™” from Superb Internet Corporation. Now, you can experience firsthand a cloud platform that consistently outperforms Amazon Web Services (AWS), IBM’s Softlayer, and Microsoft’s Azure when it comes to CPU and …
Email security requires an ever evolving service that stays up to date with counter-evolving threats. The Email Laundry perform Research and Development to ensure their email security service evolves faster than cyber criminals. We apply our Threat…
The Email Laundry PDF encryption service allows companies to send confidential encrypted  emails to anybody. The PDF document can also contain attachments that are embedded in the encrypted PDF. The password is randomly generated by The Email Laundr…

830 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