jQuery - ajax调用中表单数据未传递

Question

我以前使用过这段精确的代码，使用PHP作为处理页面，但现在在ColdFusion中（无论我使用cfc还是只是cfm进行处理），jQuery似乎无法传递表单对象 - 好吧......如果我查看firebug响应，“post”选项卡确实显示了所有字段及其值。application/x-www-form-urlencoded但是URL属性中的页面没有获取它。并且（在下面的示例中）控制台日志（数据）显示为空字符串。

下面是我的代码：

$( '#create_client' ).on( 'click', function( event ) {

    //form validation
    var bValid = true;

    if ( bValid ) {
        // AJAX Post data
        $.ajax({
            type: 'POST',
            dataType: 'html',
            cache: false,
            url: '/cfc/clent.cfc?method=put',
            data: $( '#client-form' ).serialize(),
            success: function( data ){
                console.log(data);
                loadClientTable();
            },
            error: function(){
                // tell user there was a problem
                $( '#clients-message' ).html( '<p>There was a problem submitting your request... Doh!</p>' );
            }
        });
    }

}

这是表单的代码：

<form name="client-form" id="client-form" class="singleLineForm" >
<label for="firstname">First Name: </label>
<input type="text" name="firstname" id="firstname" value="" maxlength="15" class="text ui-widget-content ui-corner-all" />
<label for="lastname">Last Name: </label>
<input type="text" name="lastname" id="lastname" value="" maxlength="15" class="text ui-widget-content ui-corner-all" />
<label for="email">Email: </label>
<input type="text" name="email" id="email" value="" maxlength="50" class="text ui-widget-content ui-corner-all" />
<label for="password">Password: </label>
<input type="text" name="password" id="password" value="" maxlength="20" class="text ui-widget-content ui-corner-all" />
<label for="isActive">Active? </label>
<input type="checkbox" name="isActive" id="isActive" value="1" class="checkbox ui-widget-content ui-corner-all" />
<input type="button" name="create_client" id="create_client" value="Create Client" class="button ui-widget-content ui-corner-all" />
</form>

现在，CFC中的put语句看起来像这样

<cffunction name="put" access="public" returntype="structure" hint="PUT method, handles data transfering." >
    <cfargument name="email" type="string" required="yes" >
    <cfargument name="password" type="string" required="yes" >
    <cfargument name="firstname" type="string" required="yes" >
    <cfargument name="lastname" type="string" required="yes" >
    <cfargument name="isActive" type="numeric" required="yes" >

    <cfset _return = '' />

    <cfquery name="insertClient" datasource="#application.DSNwrite#" >
        INSERT INTO clients
        ( 
            email
            ,password
            ,firstname
            ,lastname
            ,isActive
        )
        VALUES
        ( 
            <cfqueryparam cfsqltype="cf_sql_varchar" value="#trim( arguments.email )#" />
            ,<cfqueryparam cfsqltype="cf_sql_varchar" value="#trim( arguments.password )#" />
            ,<cfqueryparam cfsqltype="cf_sql_varchar" value="#trim( arguments.firstname )#" />
            ,<cfqueryparam cfsqltype="cf_sql_varchar" value="#trim( arguments.lastname )#" />
            ,<cfqueryparam cfsqltype="cf_sql_bit" value="#val( arguments.isActive )#" />
        )
    </cfquery>

    <cfreturn _return />
</cffunction>

- j-p

---

你能展示一下client.put()函数的代码吗？ - Scott Stroz

@scott - 给你了... - j-p

也许尝试将POST更改为PUT？ - 1337holiday

检查数据库表中的新记录将是您假设更准确的测试。您可以返回“耶，它起作用了”，但这仅意味着它在没有错误的情况下到达了结尾。这并不意味着它做了您期望的事情。如果您的值未传递，那么您将在<CFARGUMENT>处收到错误，因为这些值是必需的。 - genericHCU

Answer 1

您的CFC方法返回了一个空字符串。

您目前的代码如下：

<cfset _return = '' />

在方法的结尾处，您会得到这个：

<cfreturn _return />

然而，您从未将_return设置为其他值。要测试是否存在此问题，请尝试执行以下操作：

 <cfset _return = 'moo' />

如果您收到返回的“moo”，则一切都按预期工作。

- Scott Stroz

Answer 2

您可以像下面这样在 ajax 调用中传递表单数据。

var formData = $('#client-form').serialize();
$.ajax({
    url: '/cfc/clent.cfc?method=put&' + formData,
    type: 'POST',
    data:{
    },
    success: function(data){},
    error: function(data){},
})

- Bhushan