使用 AJAX 提交位于 div 内的表单答案

【问题标题】：Submiting a form that is inside a div with AJAX使用 AJAX 提交位于 div 内的表单
【发布时间】：2011-05-31 13:01:35
【问题描述】：

我正在尝试使用 AJAX 提交表单以阻止浏览器刷新页面。表单位于辅助页面内，该页面被调用到主页 div 中（类似于使用母版页和内容占位符）。

我尝试了几种方法，但总是遇到同样的问题。每当我尝试提交表单时，响应都是带有表单的辅助页面，我无法将 awnser 按预期放置在主页的内容 div 中。

关于如何完成这项工作的任何提示？

    Main Page


    <div id="content"> Secondary page content goes in here loaded using AJAX</div>



    Secondary Page

    <form runat="server" id="formuser">
            <asp:TextBox ID="txtusername" runat="server"></asp:TextBox>
            <asp:TextBox ID="txtemail" runat="server"></asp:TextBox>
            <a href="#" onclick="document.formuser.submit()"> Submit Form </a>
    </form>

我打算做的是提交上述表格，同时留在主页并在内容 div 中显示响应。我需要表单为 runat="server"，以便我可以使用代码隐藏来操作数据。

【问题讨论】：

请给我一些代码好吗？
这就是页面的组织方式。
这个地方的设计方式是您将答案发布为答案，然后尽可能将其标记为已接受（在您接受自己的答案之前有一个间隔）。不是通过编辑问题并将 [已解决] 放在其标题中。请阅读FAQ。

标签： c# jquery asp.net ajax

【解决方案1】：

使用一些jquery：

       $('#SaveFormButton').click(function (e) {
                $.ajax({
                    type: "POST",
                    url: $('#FormToSubmit').attr("action"),
                    data: $('#FormToSubmit').serialize(),
                    success: function (data) {
                        //Whatever you want to do after the form has posted
                    },
                    error: function(data){
                        alert("Error");
                    }
                });
        });

【讨论】：

使用该方法提交表单，如何在代码隐藏中检索数据？

【解决方案2】：

这样的事情应该可以做到。通过这种方式使用 e.preventDefault() 您可以使用标准表单标记和提交按钮。

http://jsfiddle.net/CcDPx/1/

【讨论】：

【解决方案3】：

看来我用于内容加载的方法是构建一个 xmlHttpRquest，它与我从 jquery 得到的响应相冲突。

【讨论】：