?
Solved

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

Posted on 2009-03-30
4
Medium Priority
?
669 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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 500 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

Building an interactive eFuture classroom

Watch and learn how ATEN provided a total control system solution including seamless switching matrix switch, HDBaseT extenders, PDU, lighting control to build an interactive eFuture classroom.

Question has a verified solution.

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

In our day to day coding, how many times have we come across a necessity to check whether a URL is a broken link or not? For those of you that answered countless and are using ColdFusion like myself, then this article is for you.  It will show yo…
Most ColdFusion developers get confused between the CFSet, Duplicate, and Structcopy methods of copying a Structure, especially which one to use when. This Article will explain the differences in the approaches with examples; therefore, after readin…
Michael from AdRem Software outlines event notifications and Automatic Corrective Actions in network monitoring. Automatic Corrective Actions are scripts, which can automatically run upon discovery of a certain undesirable condition in your network.…
In this brief tutorial Pawel from AdRem Software explains how you can quickly find out which services are running on your network, or what are the IP addresses of servers responsible for each service. Software used is freeware NetCrunch Tools (https…
Suggested Courses

764 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