I've got an issue with a feature that I'm trying to build. I'm submitting a form using fetch. The fetch call sends the form to a remote function to http://localhost/8500/pdf/forms.cfc. In my JS code it looks like so:

fetch('<http://localhost:8500/pdf/forms.cfc?method=getreferral',{method>:"post", body: form_data})

Rather than a "get" I'm using "post" so that I can access my form variables through the form.scope. forms.cfc looks like so:

remote struct function getReferral()
    returnFormat="json"
    {
        cfheader(name="Access-Control-Allow-Origin", value="<http://localhost>" )

I'm early in the process and just trying to read my form values from the form.scope. The first formfield that I tested was form.debtor_id.

remote struct function getReferral()
    returnFormat="json"
    {
        cfheader(name="Access-Control-Allow-Origin", value="<http://localhost>" )

        return {completed: true, test: form.debtor_id }
}

In my browser console.log I see this return:

{
  "COMPLETED": true,
  "TEST": "1679"
}

It seems I'm accessing the form just fine. Further testing with the following code:

remote struct function getReferral()
    returnFormat="json"
    {
        cfheader(name="Access-Control-Allow-Origin", value="<http://localhost>" )

        // return {completed: true, test: form.debtor_id }

        test = {}

        cfloop(collection="# form #", item="fld" )
        {
            test["# fld #"] = form[fld]
        }

        return test
}

Again console.log shows:

{
  "DEBTOR_FNAME": "Wen",
  "SPOUSE_PARTNER": "",
  "LIST_AGENT": "Kailee Rainey",
  "DEBTOR_LNAME": " redacted ",
  "REFERRAL_PERCENTAGE": "",
  "SESSION_USER": "Hugh Rainey",
  "PROSPECT_ADDRESS": " redacted ",
  "DEBTOR_ID": "1679",
  "AGENT_EMAIL": " redacted ",
  "AGENT_PHONE": " redacted ",
  "TRUSTEEID": "715",
  "CASENO": "24-10611",
  "LIST_OFFICE": "RE/MAX Advantage Realty",
  "TRUSTEE_NAME": " redacted "
}

My form is being sent and all data is present in the form scope. Accept when I try this:

local.dID = form.debtor_id

Then I get an error returned from CF

The following information is meant for the website developer for debugging purposes.
Error Occurred While Processing Request
Element DEBTOR_ID is undefined in FORM.

I've tried testing each of the form variables you see in the console.log and they all fail. It looks like I can reference form objects but when I try to assign their values to a variable then I get an error. Does anyone know why this might be happening?

What has worked for me is to convert the form data to a JSON string when it is posted...

JSON.stringify( formData )

and then deserialze it in CF...

FormStruct = DeserializeJSON(arguments.FormData)

If you want it to populate the form scope then you need to add the correct

Content-type"

header which is

application/x-www-form-urlencoded

for a form submission. See https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#supplying_request_options

I think fetch may be presenting the data in the request body, not the form scope. You'd want to look at getHTTPRequestData() and related functions to retrieve it.

I suspect that, when

fetch

posts the form, the request is performed and the form is posted. However, ColdFusion may not yet have the form data in its response. I would suggest that you replace

fetch

with a CFML call such as

cfinvoke

. That way, you'll be 100% sure that the response contains the posted form-data. For example,

// The cfc

component {

remote struct function getReferral(required struct formData) output=false returnFormat="JSON" {

cfheader(name="Access-Control-Allow-Origin", value="<http://localhost>" )

return arguments.formData;

}

}

//cfm calling page

formStruct={

"DEBTOR_FNAME":"Wen",

"SPOUSE_PARTNER":"",

"LIST_AGENT":"Kailee Rainey",

"DEBTOR_LNAME":" redacted ",

"REFERRAL_PERCENTAGE":"",

"SESSION_USER":"Hugh Rainey",

"PROSPECT_ADDRESS":" redacted ",

"DEBTOR_ID":"1679",

"AGENT_EMAIL":" redacted ",

"AGENT_PHONE":" redacted ",

"TRUSTEEID":"715",

"CASENO":"24-10611",

"LIST_OFFICE":"RE/MAX Advantage Realty",

"TRUSTEE_NAME":" redacted "

};

cfinvoke(component="<http://path.to|path.to>.cfc", method="getReferral", returnvariable="result")

{

cfinvokeargument(name="formdata", value=formStruct);

}

writeDump(var=result, label="Invocation Result");

writeoutput("Debtor ID = " & result.debtor_id);