使用 jQuery 将表单发布到 Web 方法变得非常困惑

Question

我有一个包含相当多值的表单。我目前正在使用 POST 方法提交，但我希望将其转换为通过 AJAX 使用 jQuery 来完成。

我一直在尝试将代码隐藏的“保存到数据库”功能转换为 Web 方法。我使用两步函数方法，首先准备 Request.Form("parameterName") 中的所有变量，然后将它们全部传递到“saveData”函数中，如下所示：

<System.Web.Services.WebMethod()> _
Public Shared Sub prepareRequestFormValues()
    /// save to database and do stuff with the variables
    variableName = HttpContext.Current.Request("parameterName")
    saveToDatabase(list, of, form, variables, ...)
End Sub

读完这篇文章 将表单序列化到 asp.net webmethod

我可以看到使用 jQuery 表单插件我可以序列化整个表单并将其作为单个变量发送到处理代码。

然而，我现在已经完全困惑了。鉴于我对 AJAX/codebehind 等还很陌生，我一直在兜圈子，现在很困惑！

使用

var queryString = $('input').fieldSerialize(); 

$.ajax({
   type: "POST",
   url: "Detail.aspx/doPostTest",
   data: "{ 'txtQuery': '" + queryString + "'}",
   contentType: "application/json; charset=utf-8",
   dataType: "json",
   success: function (data) {
        var products = eval(data.d);                             
        console.log(products);
   }
});

从上面提到的帖子，我可以看到我可以发送这个字符串，但是收到后如何在服务器端处理它？该文章暗示 HttpContext.Current.Request.Form("parameterName") 应该可以工作，但事实并非如此......我猜是因为我需要从 txtQuery 变量访问它。 ..但是...我恐怕迷路了！

Answer 1

这是一个非常好的教程 包含执行此操作的 JS。不要发布到 PHP，而是发布到您的 aspx 页面。这是有类似问题的论坛帖子。 XIII发布了以下代码。

<script src="../Scripts/jquery-1.6.1.js" type="text/javascript"></script>

<script type="text/javascript">

    $(function () {
        $('#btnAddToCart').click(function () {
            var result = $.ajax({
                type: "POST",
                url: "PassInParameterAndUpdateSession.aspx/AddProductToCart",
                data: '{ pID: "1833", qty: "13", lblType: "1" }',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: succeeded,
                failure: function (msg) {
                    alert(msg);
                },
                error: function (xhr, err) {
                    alert(err);
                }
            });
        });
    });

    function succeeded(msg) {
        alert(msg.d);
    }

</script>

还有你的WebMethod

Imports System.Web
Imports System.Web.Services
Imports System.Web.Script.Services

    Namespace aspnetforums.AjaxAndSession
        <ScriptService> _
        Public Partial Class PassInParameterAndUpdateSession
            Inherits System.Web.UI.Page
            Protected Sub Page_Load(sender As Object, e As EventArgs)
                Session("test") = ""
            End Sub

            <WebMethod> _
            Public Shared Function AddProductToCart(pID As String, qty As String, lblType As String) As String
                Dim selectedProduct As String = String.Format("+ {0} - {1} - {2}", pID, qty, lblType)

                HttpContext.Current.Session("test") += selectedProduct

                Return HttpContext.Current.Session("test").ToString()
            End Function
        End Class
End Namespace