使用jQuery / Ajax / JSON从FORM捕获数据

时间:2010-04-10 03:17:34

标签: asp.net json jquery

我在表单上有几个文本框,当用户提交时我想捕获数据并将其插入数据库。

这是我的代码看起来像

// Called just before the form is submitted.
beforeSubmit: function(data)
{
    var item = $("[id$='item']");
    var category = $("[id$='category']");
    var record = $("[id$='record']");

    var json = "{'ItemName':'" + escape(item.val()) +
        "','CategoryID':'" + category.val() + "','RecordID':'" + record.val() + "'}";

    //This page is where data is to be retrieved and processed.
    var ajaxPage = "DataProcessor.aspx?Save=1";

    var options =
    {
        type: "POST",
        url: ajaxPage,
        data: json,
        contentType: "application/json;charset=utf-8",
        dataType: "json",
        async: false,
        success: function(response)
        {
            alert("success: " + response);
        },
        error: function(msg)
        {
            alert("failed: " + msg);
        }
    };

    //Execute the Ajax call and get a response.
    var returnText = $.ajax(options).responseText;
    if (returnText == 1) {
        record.html(returnText);
        $("#divMsg").html("<font color=blue>Record saved successfully.</font>");
    }
    else
    {
        record.html(returnText);
        $("#divMsg").html("<font color=red>Record not saved successfully.</font>");
    }

    // $("#data").html("<font color=blue>Data sent to the server :</font> <br />" + $.param(data));
},

以下是发送到服务器的数据:如果我取消注释以下行。

 // $("#data").html("<font color=blue>Data sent to the server :</font> <br />" + $.param(data));
__VIEWSTATE=%2FwEPDwULLTE4ODM1ODM4NDFkZOFEQfA7cHuTisEwOQmIaj1nYR23&__EVENTVALIDATION=%2FwEWDwLuksaHBgLniKOABAKV8o75BgLlosbxAgKUjpHvCALf9YLVCgLCtfnhAQKyqcC9BQL357nNAQLW9%2FeuDQKvpuq2CALyveCRDwKgoPWXDAKhwImNCwKiwImN &day_fi=12&month_fi=12&year_fi=1234&lastFour_fi=777&countryPrefix_fi=1&areaCode_fi=555-555&phoneNumber_fi=5555&email_fi=nisardotnet%40gmail.com&username=nisarkhan&password=123456&retypePassword=123456

2 个答案:

答案 0 :(得分:1)

Nisardotnet - 你在C#工作吗?你在这里走得太远了。您可以使用Web方法将代码减少一半 - 同时,摆脱视图状态 - 您不需要它(从页面中删除表单)

如果你在C#工作让我知道,我可以提供帮助。 罗布

**** **** APPEND

好的 - 我构建了一个简单的“抓取输入值和更新数据库”的东西 - 它位于我的网站here上。

如果您有任何疑问,请给我一个大喊。 罗布

**** **** APPEND

好的,所以在你的班级文件中你可以有

internal static void updateDB(String values)
{
    // do something with 'values'
}

然后在您的aspx页面中,您可以这样称呼它......

[WebMethod]
public static void updateDB(String values)
{
    yourClass.updateDB(values);
}

这应该有效。

答案 1 :(得分:0)

你应该能够将它全部从Request.Form中拉出来。