Solved

Calling a coldfusion  cfc on Blur with javascript or Jquery  :  (needs tweaking)

Posted on 2010-09-03
5
1,098 Views
Last Modified: 2012-05-10
I am attempting to onblur: of a form field call a function that calls a cfc
and does an insert.

I have this:
Javascript:
<cfajaxproxy cfc="cfc/ZQuote" jsclassname="cfcZQuote" />
<script language="javascript">
function fastData(name, lname, phone1,phone2,phone3,email){
 var proxy = new cfcZQuote();
proxy.AddData(name,lname,phone1,phone2,phone3,email)
}
</script>


This form field.


<input name="email" type="text" id="email" class="menu" size="20" onblur="return fastdata(this.form.firstname,this.form.lastname,this.form.phone1,this.form.phone2,this.form.phone3,this.form.email);">

this is mY cfc:

<cfcomponent name="ZQuote" displayname="ZQuote" >
      <cffunction name="AddData" access="remote" output="no" returntype="struct">
                          <cfargument name="name" type="string" required="yes" />
                          <cfargument name="lname" type="string" required="yes" />
                          <cfargument name="Phone1" type="string" required="yes" />
                         <cfargument name="Phone2" type="string" required="yes" />
                        <cfargument name="Phone3" type="string" required="yes" />
                        <cfargument name="email" type="string" required="yes" />
            
            <cfset var returnStruct = StructNew()>
            <cfset returnStruct.agentID = arguments.name>
            <cfset returnStruct.Phone = arguments.Phone1 & arguments.Phone2 & arguments.Phone3 >
            <cfset returnStruct.uniqueID = "">
                  <!--- Update db with new data--->
<cfquery name="The_Query" datasource="#db#">
INSERT INTO Table      
                (name,lastname,phone)
                Values ('#returnstruct.name#','#returnStruct.lname#','#returnstruct.phone#'
                        SELECT SCOPE_IDENTITY() as ID
                  </cfquery>
</cfif>                  
                  <cfset returnStruct.uniqueID = The_query.id>

            

            <cfreturn returnStruct>
      </cffunction>
   
    </cfcomponent>
0
Comment
Question by:LeadCo
[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
5 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 33601564
Could you post a generated page ?
(right click on the page in the browser and choose : view source)
0
 

Author Comment

by:LeadCo
ID: 33601919
argumentCollection={"name"%3A{}%2C"lname"%3A{}%2C"Phone1"%3A{}%2C"Phone2"%3A{}%2C"Phone3"%3A{}%2C"email"%3A{}}&_cf_nodebug=true&_cf_nocache=true&_cf_rc=0

Ok looks like the form values are coming across.

hmmm ... any suggestions how to pass a collection of form values through the function() on blur of 1 field.

<input name="email" type="text" id="email" class="menu" size="20" onblur="return fastdata(this.form.firstname,this.form.lastname,this.form.phone1,this.form.phone2,this.form.phone3,this.form.email);">
0
 
LVL 52

Accepted Solution

by:
_agx_ earned 250 total points
ID: 33602246
>> return fastdata(this.form.firstname,  this.form.lastname

You're passing in the form field objects NOT their values  ie this.form.firstname.value
0
 
LVL 52

Expert Comment

by:_agx_
ID: 33602252
... that submitted before I was finished.

I meant to say pass in the value:  

      this.form.firstname.value  

... _not_ the object
        this.form.firstname



0
 
LVL 6

Assisted Solution

by:reiters
reiters earned 250 total points
ID: 33695811
Here is the jQuery way of doing it.  Make sure you have jQuery loaded on the page.  Remember that variables are case sensitive.

IF using jQuery, then you wont need any of the cfajaxproxy stuff. Also the onBlur ont he form field would be removed.  If the <script> is inside a cfoutput, make sure you change the # to ##
<script type="text/javascript">
   $("document").ready(function(){
      $("#email").blur(function(){
         $.ajax({
            url: 'cfc/ZQuote.cfc?method=AddData&name=' + $("#name").val() + '&lname=' + $("#lname").val() + '&Phone1=' +$("#Phone1").val()  + '&phone2=' + $("#phone2").val() + '&Phone3=' + $("#phone3").val() + '&email=' +$("#email").val() ,
            cache: false,
            success: function(){
               // anything u want to happen after the cfc call
               };
            });
         });
      });
</script>

Open in new window

0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

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

Suggested Solutions

CFGRID Custom Functionality Series -  Part 1 Hi Guys, I was once asked how it is possible to to add a hyperlink in the cfgrid and open the window to show the data. Now this is quite simple, I have to use the EXT JS library for this and I achiev…
The most up-to-date version of this article is on my Blog https://iconoun.com/blog/
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

751 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