Skip to main content
March 9, 2010
Question

Form submission to a CFC

  • March 9, 2010
  • 1 reply
  • 1713 views

Hello,

I am trying to create a form that submits the data to a cfc and then once submitted to just display a message where the form used to be to say "Thank you for submitting your data".

Here is what i have so far, but first i can't even get the data to submit to the cfc and then i don't know how to keep them on the same page but just change where the form used to be to just display a message once the data is submitted.

<!--- Form --->

<cfform action="cfc.test?method=insert" method="post">
<table align="center">
<tr>
     <td>First Name</td>
        <td><cfinput type="text" name="fname" required="yes" message="Please enter a valid first name."></td>
    </tr>
   
    <tr>
     <td>Last Name</td>
        <td><cfinput type="text" name="lname" required="yes" message="Please enter a valid last name."></td>
    </tr>
   
    <tr>
     <td>Email</td>
        <td><cfinput type="text" name="email" required="yes" validate="email" message="Please enter a valid email address."></td>
    </tr>
   
    <tr>
     <td>Phone</td>
        <td><cfinput type="text" name="phone" required="yes" validate="telephone" message="Please enter a valid telephone number."></td>
    </tr>
   
    <tr>
     <td colspan="2"><cfinput type="submit" name="Submit" value="Submit"></td>
    </tr>
</table>
</cfform>

<!--- CFC --->

<cfcomponent>
<cffunction name="insert" access="remote" returntype="void">
        <cfargument name="fname" type="string" required="yes">
        <cfargument name="lname" type="string" required="yes">
        <cfargument name="email" type="string" required="yes">
        <cfargument name="phone" type="string" required="yes">
       
        <cfquery name="insertData" datasource="#application.dsn#">
         INSERT INTO tbl_data
            VALUES('#arguments.fname#','#arguments.lname#','#arguments.email#','#arguments.phone#')
        </cfquery>
       
</cffunction>
</cfcomponent>

    This topic has been closed for replies.

    1 reply

    existdissolve
    Inspiring
    March 9, 2010

    I would start by thinking a bit differently about your CFC.  In your code, you're submitting the form to the CFC, almost as if it's another "action" .cfm page.  But CFC's are not really the same.  Think of them as a collection of functions that you pass arguments to and receive data from, rather than "pages" like the one that contains the form.

    So, I would start by looking into <cfinvoke> and cfobject (cfinvoke might be easier for starting off).

    Start by submitting the form to the current page, RATHER than the CFC itself.

    Then, you could do something like this:

    <cfif isDefined("FORM.submit")>

         <cfinvoke component="cfc" method="insert" returnvalue="successmessage">

              <cfinvokeargument name="fname" value="#FORM.fname#" />

              ... other form fields in similar cfinvokeargument statements...

         </cfinvoke>

    </cfif>

    And then in your CFC, you could specify to return a success message from this "insert" method like so:

    (Notice the change of returntype....)

    <cffunction name="insert" access="remote" returntype="string">
             <cfargument name="fname" type="string" required="yes">
             <cfargument name="lname" type="string" required="yes">
             <cfargument name="email" type="string" required="yes">
             <cfargument name="phone" type="string" required="yes">
             <cfset var successmessage = "">
            <cfquery name="insertData"  datasource="#application.dsn#">
             INSERT INTO tbl_data
                  VALUES('#arguments.fname#','#arguments.lname#','#arguments.email#','#arguments.  phone#')
            </cfquery>
            <cfset msg = "Your submission was successful!">

            <cfreturn successmessage />
    </cffunction>

    OR you could call another method from within the "insert" method that takes care of generic message handling...

    Either way, on your calling page, you can now do the following:

    <cfif isDefined("successmessage")>

         <cfoutput>#successmessage#</cfoutput>

         [and hide form it if it exists]

    </cfif>

    where "#successmessage#" is the return variable from the original CFC invocation.

    ---------------------------------------------------

    Obviously, there are a billion ways this could be done (like calling the CFC from AJAX, and asynchronously returning the message), but hopefully this will give you a start.

    Hope it helps

    existdissolve
    Inspiring
    March 9, 2010

    --------------------------------------------------------

    BRAIN FART

    Above, "cfobject" should be "createObject"...sorry...

    --------------------------------------------------------

    Here are links to the sections in the docs I mentioned: