我工作的一个ColdFusion 8训练应用程序，我正在做一些AJAX请求（不带任何资料库，如jQuery的），以支持一个非常基本的CRUD应用程序。   高层次的体系结构包括CFM观点，与接收AJAX请求远程访问方法，以及CFC它作为一种模式，并拥有所有的数据库查询一个CFC。   对于刚刚获取的数据，不需要任何形式的绑定变量（如获取表中的所有行），AJAX的查询工作的罚款。当我尝试张贴任何商品共同基金中间层，但是，我越来越对我在寻找被未定义的表范围的误差值（从我的理解就是后期的参数将被保存）。我甚至解剖与篡改数据的请求，并确认后参数的名称和值，我希望他们可以。

I am working on a ColdFusion 8 training application where I'm making some AJAX requests (without any libraries such as jQuery) to support a very basic CRUD application. The high level architecture includes a CFM view, a CFC with remote access methods which receive the AJAX requests, and a CFC which acts as a model and has all of the database queries. For just retrieving data that doesn't require any sort of bind variables (like getting all rows from the table), the AJAX queries are working fine. When I try to post anything to the CFC middle layer, however, I'm getting errors about the values I'm looking for being undefined in the Form scope (which from my understanding is where post parameters will be stored). I even dissected the requests with Tamper Data and verified that the names and values of the post parameters are as I expect them to be.

下面是JS AJAX请求的例子：

Here is an example of the JS AJAX requests:

    function addLocation(locToAdd) {
            var thisAccess = new AccessStruct("POST", "jsontest.cfc?method=addNewLocation", getLocations, "newLoc=" + JSON.stringify(locToAdd));
            accessWrapper("addLoc", thisAccess);

    function accessWrapper(action, accessDef) {
            var ajaxRequest = new XMLHttpRequest();
            var nextStep;
            if (action != "getLocs") {
                nextStep = getLocations;
            } else {
                nextStep = buildTable;
            }

            ajaxRequest.onreadystatechange = function() { // using a closure so that the callback can
                if (ajaxRequest.readyState == 4) {        //   examine the request and nextStep
                    if (ajaxRequest.status == 200) {
                        if (nextStep != null) {
                            nextStep(ajaxRequest);
                        }
                        return true;
                    } else {
                        alert("Request Could Not Be Completed; Errors On Page");
                        return false;
                    }
                }
            }
            ajaxRequest.open(accessDef.method, accessDef.url, true);
            ajaxRequest.send("newLoc=" + accessDef.params);
    }


    function Loc(locCode, parLocCode, name, addrL1, addrL2,
                            city, stateProv, postal, locTypeCode) {
            this.locCode     = locCode;
            this.parLocCode  = parLocCode;
            this.name        = name;
            this.addrL1      = addrL1;
            this.addrL2      = addrL2;
            this.city        = city;
            this.stateProv   = stateProv;
            this.postal      = postal;
            this.locTypeCode = locTypeCode;
        }

        function AccessStruct(method, url, nextStep, params) {
            this.method   = method;
            this.url      = url;
            this.nextStep = nextStep;
            this.params   = params;
        }

从本质上发生的事情在页面上是填充的所有位置的表（LOC）记录被渲染为用户。有一个表单中添加一个新用户，当他们点击添加按钮，禄结构中创建包含他们进入，并传递给addLocation功能的信息。这就形成了结构的访问，这将包括请求的URL，方法，函数充当回调的名称，和任何后的参数。这一切传递到accessWrapper功能，这将创建XMLHtt prequest和处理Ajax请求。我用了一个封闭的onreadystatechange的回调函数，这样就可以知道在访问结构定义的XMLHtt prequest对象和回调函数（这种回调函数将通常被用来刷新视图表后，记录添加，删除或编辑）。

Essentially what's happening on the page is that a table populated by all the location (loc) records is being rendered for a "user". There is a form to add a new user, and when they click the add button, a Loc structure is created containing the information they entered and is passed to the addLocation function. This creates an Access structure, which will include the request URL, method, the name of a function to act as a callback, and any post parameters. This is all passed into the accessWrapper function, which will create the XMLHttpRequest and process the AJAX request. I used a closure for the onreadystatechange callback function so that it could be aware of the XMLHttpRequest object and the callback function defined in the Access structure (this callback function will be generally be used to refresh the view table after a record is added, deleted, or edited).

下面是那里的问题是从报道的中间层CFC内cffunction。我不会打扰张贴DAO CFC因为在别的地方测试，甚至没有在这个过程中所达到的（因为它的失败在中间[或控制器]级）

Here is the cffunction within the middle-layer CFC where the problem is being reported from. I won't bother to post the DAO CFC as that has been tested elsewhere and is not even being reached during this process (because it's failing at the middle [or controller] level)

 <cffunction name="addNewLocation" output="false" access="remote">
    <cfset var deserializedLocation = "">
    <cfscript>
        deserializedLocation = DeserializeJSON(Form.newLoc);
    </cfscript> 
    <cfobject component="locationDAO" name="locationDAOObj">
    <cfinvoke
        component="#locationDAOObj#"
        method="addLocation">
        <cfinvokeargument name="code" value="#deserializedLocation.locCode#">
        <cfinvokeargument name="parentCode" value="#deserializedLocation.parLocCode#">
        <cfinvokeargument name="name" value="#deserializedLocation.name#">
        <cfinvokeargument name="addr1" value="#deserializedLocation.addrL1#">
        <cfinvokeargument name="addr2" value="#deserializedLocation.addrL2#">
        <cfinvokeargument name="city" value="#deserializedLocation.city#">
        <cfinvokeargument name="stateProv" value="#deserializedLocation.stateProv#">
        <cfinvokeargument name="postal" value="#deserializedLocation.postal#">
        <cfinvokeargument name="locationType" value="#deserializedLocation.locTypeCode#">
    </cfinvoke>
</cffunction>

在请求响应的错误是：     500元NEWLOC是不确定的FORM

The error in the request response is: 500 Element NEWLOC is undefined in FORM

就像我之前说的，我已经检查中篡改数据的请求，并且它看起来很好那里。在此先感谢您的帮助，你伟大的人也许能提供！

Like I said before, I've checked the request in Tamper Data, and it looks fine there. Thanks in advance for any help you great folks might be able to offer!

推荐答案

但是绝对是FORM范围，当你做一个Ajax张贴到CFC。

There absolutely is a FORM scope when you do an Ajax post to a CFC.

这个例子的POST形成通过Ajax的数据到CFC功能的不带参数的和返回的形式，范围JSON格式。是的，你应该有参数文件，指定要求的/不是必需的数据类型，但它们不是强制性的。

This example POSTs form data via Ajax to a CFC function with no arguments and returns the JSON format of the FORM scope. Yes, you should have arguments to document, specify required/not required and data type, but they're not mandatory.

有没有使用jQuery的任何原因？或许，这将让您的生活变得更加容易。

Is there any reason you aren't using jQuery? It would probably make your life much easier.

一定有什么问题你是如何发送表单数据的Ajax调用。如果您使用Firebug看你的Ajax调用，您可以看到张贴的参数。

There must be something wrong with how you're sending the form data to the Ajax call. If you use FireBug to watch your Ajax calls, you can see the POSTed parameters.

HTML

<html>
    <head>
        <title>Ajax POST to CFC</title>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript" src="test.js">
    </head>
    <body>

        <form id="foo" action="" method="post">

            <input type="text" id="a" name="a" value="Hello" />
            <br />
            <input type="text" id="b" name="b" value="Goodbye" />
            <br />

            <textarea id="data" cols="30" rows="10" disabled="true"></textarea>
            <br />
            <input type="button" id="btnSubmit" value="Do Ajax!" />

        </form>

    </body>

</html>

的JavaScript

$(document).ready(function() {
    $('#btnSubmit').on('click', function() {
        $.ajax({
            asynch : true,
            type : 'POST',
            dataType : 'json',
            url : 'test.cfc?method=testing&returnformat=json',
            data : {
                a : $('#a').val(),
                b : $('#b').val()
            },
            success : function(data, textStatus) {
                $('#data').val(JSON.stringify(data));
            }
        });
    });
});

CFC

<cfcomponent>
    <cffunction name="testing" access="remote" output="false" returntype="string">
        <cfreturn serializeJSON( form ) />
    </cffunction>> 
</cfcomponent>

老学校，没有jQuery的，只是简单的醇'的JavaScript

我发现了一个Ajax POST没有的jQuery这里的一个简单的例子： http://www.openjs.com/articles/ajax_xmlhttp_using_post.php

I found a simple example of an Ajax POST without jQuery here: http://www.openjs.com/articles/ajax_xmlhttp_using_post.php

HTML 卸下jQuery脚本标签，换另一脚本来测试，nojq.js并更改提交按钮添加onclick事件。

<input type="button" id="btnSubmit" value="Do Ajax!" onclick="doSubmit();" />

function doSubmit(){
    var http = new XMLHttpRequest();
    var url = "test.cfc";
    var params = "method=testing&returnformat=json";
        params += "&a=" + document.getElementById('a').value;
        params += "&b=" + document.getElementById('b').value;
    http.open("POST", url, true);
    //Send the proper header information along with the request
    http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    http.setRequestHeader("Content-length", params.length);
    http.setRequestHeader("Connection", "close");
    http.onreadystatechange = function() {//Call a function when the state changes.
        if(http.readyState == 4 && http.status == 200) {
            document.getElementById('data').value = http.responseText;
        }
    }
    http.send(params);
}