Question

我有一个带有可替换div的页面，它被用作用户界面的一部分，用于管理表单以更新有关任何一个项目的信息。

所以有一个项目列表，每个项目都有一个来自数据库的ID，每个项目都有一个“管理项目”链接。当用户单击该链接时，AJAX将使用用户输入进度更新和表格的表单替换div。其他信息到表单元素。

该表单有一个提交按钮，AJAX-es在第三页，我想运行更新查询和打印确认信息。我创建了一个带有switch语句的AJAX控制器ColdFusion页面，以根据URL中变量的switch语句确定要加载到div的页面。 URL变量由jQuery在点击时设置，具体取决于点击的链接（即？ajax =为此管理。）

我没有遇到任何以这种方式传递URL变量的问题，但现在我正在使用文本框我想将表单数据作为序列化的POST数据发送到第三页。但我无法弄清楚如何序列化表单并使用$ .ajax（）

将其与其他URL变量一起发送

第一页

<input type="hidden" id="selection">
<a href="" onClick="return false;">
    <span style="font-size: 1.3em;" class="manage" 
        <!--- PROJ_CDE is the project's unique ID in the database--->
        onClick="$('##selection').val('#PROJ_CDE#');">
        Manage Project
    </span>
</a>

第一个AJAX控制器

$('.manage').click(function()
{
    // Gets the project code to pull AJAX content for
    var project = $('#selection').val();
    // Send the project code & chosen link to AJAX controller
    $.ajax(
    {
        type: "POST",
        url: "inc/ajax/ajax_ctrl.cfm?ajax=manage&project=" + project,
        success: function(returnedData)
        {
            // Tells JS which project to switch content out for
            $('#replaceDiv' + '_' + $('#selection').val()).html(returnedData);
        }
    });
});

ColdFusion AJAX控制器

<cfset ajax = url.ajax>
<cfswitch expression="#ajax#">
    <cfcase value="manage">
        <cfinclude template="manage.cfm"></cfcase>
    <cfcase value="manage_sbmt">
        <cfinclude template="manage_sbmt.cfm"></cfcase>
    <cfcase value="main">
        <cfinclude template="main.cfm"></cfcase>
    <cfdefaultcase>
        Nothing loaded!</cfdefaultcase>
</cfswitch>

第二页（表格）

<script src="js/ajax_ctrl.js"></script>
<cfset project = url.project>
<form id="updates" method="post">
    <input type="hidden" id="selection" value="changeme">
    Update Progress<br />
    <div id="hidden_prgrs"><br />
        <textarea id="upd_prgrs_text" cols="75" rows="8"></textarea><br /><br />
        <hr />
    </div><br />
    <br />
    <span class="manage_sbmt" onClick="$('##selection').val('#project#');">
        <input type="submit" class="submit" value="Update Project!" onClick="return false;">
    </span>
</form>

第二个AJAX控制器

$('.manage_sbmt').click(function()
{
    var project = $('#selection').val();
    var form = $('#updates');
    $.ajax(
    {
        type: "POST",
        url: "inc/ajax/ajax_ctrl.cfm?ajax=manage_sbmt&project=" + project,
        success: function(data)
        {
            $('#replaceDiv' + '_' + $('#selection').val()).html(data);
        }
    });
});

再次点击CF切换页面＆amp;加载manage_sbmt，我只是试图转储变量范围＆amp;让它打印textarea输入。

在我的第二个AJAX控制器中，在$ .ajax（）中，我一直在尝试使用data参数来序列化＆amp;传递完整的表格，但它不起作用。我以为这会实现它，但当我提醒（数据）;我得到了奇怪的输出，似乎是随机的HTML东西。

data: form.serialize(),

为什么表单没有发布到第三页？甚至可以用$ .ajax（）来做到这一点吗？我想避免将整个文本框编码为URL，因为存在字符限制，并且出于其他明显的原因......

Answer 1

穆萨有正确的答案。我需要在表单元素中添加一个name属性，然后当我执行cfdump var =＆＃34; #form＃＆＃34;它出现了。

jQuery AJAX：混合URL变量和POST数据（ColdFusion）

1 个答案: