通过AJAX和JQUERY提交.NET简单表单

多亏了balexandre和rtiq，我已经完成了所有流程。正在调用我的.ashx文件，因此我知道部分代码正在工作，并且它正在向我发出错误警报。当我跟踪.NET时，通过context.Request[“email”]和context.Request[“optin”]拉入的变量为空

我知道有点不对劲，但我看不出来。我已经重新编辑了这篇文章，以获得最新的代码

头中的jQuery 形式和元素运行正常。我们只是得到这个空值，无法插入。ajax正在正确调用.ashx文件，并且该文件正在编译，请求的变量为null。。以前的帮助太棒了，如果有人能帮我解决最后一个问题，你会得到当天的金星奖

---

在书籍中离线搜索了一些内容后，我终于在与balexandres.aspx方法的结合中找到了这一点：

解决方案 尝试更改此选项：

$("#connectButton").submit(function () {
    alert("hello click");
    (...)

为此：

$("#connectButton").click(function (evt) {
    evt.preventDefault();
    alert("hello click");
    (...)

您还必须记住，ASP.NET服务器控件的ID与呈现的DOM控件ID不同。这可能是您不触发警报的原因。如果在与服务器控件相同的页面上编写客户端脚本，则可以通过以下方式“呈现”脚本标记中的ClientID：

$("<%= connectButton.ClientID %>").click( ...

$（“”）。单击（。。。

另一件事。如果在头脚本中使用jQuery选择，它们可能会过早触发，无法找到控件。您应该在创建DOM控件后运行它们。要做到这一点，需要使用“ready”事件：

---

您的html代码中没有表单，因为您可能不使用submit。 如rciq所述，改用单击。

• 在网站根目录中创建一个名为

  asynchronous

• 创建一个名为

  addEmail.aspx

  的新

  aspx

  页面，并删除除第1行以外的所有HTML
• 在

  addEmail.aspx

  中，您将代码放在后面，如：

• 在包含

  .ajax（）

  调用的主页面中，将

  url

  属性更改为

  url:“/asynchronous/insertEmail.aspx”，

您将在

msg

的

success:function（msg）{}

中插入字符串

email

这就是我经常做的，虽然，我没有创建一个ASPX页面，而是使用ASHX（通用处理程序）页面，它不包含任何ASP.NET页面循环（加载速度更快），而且是一个简单的页面

---

如果要改用

通用处理程序

，请在

异步

文件夹内创建一个名为

inserEmail.ashx

的文件，完整代码如下：

public class insertEmail : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        string email = context.Request["email"],
               optin = context.Request["optin"];

        string strSQL = "INSERT INTO Emails (emailAddress,optIn) VALUES('" + email.ToString() + "', optin)";
        SqlConnection Conn = new SqlConnection(strConnection);
        SqlCommand Command = new SqlCommand(strSQL, Conn);
        Conn.Open();
        Command.ExecuteNonQuery();
        Conn.Close();

        context.Response.ContentType = "text/plain";
        context.Response.Write("email inserted");
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

另外，请记住将

url

属性更改为

url:“/asynchronous/insertEmail.ashx”，

---

从您的评论中，我意识到您的

数据
属性也不正确

正确答案是：

data: { 
        "email" : $(".emailConnectTextBox").val(), 
        "optin" : $(".connectCheckbox").val() },

您的完整ajax调用应该是：

$.ajax({
    type: "POST",
    url: "/asynchronous/insertEmail.ashx",
    data: { 
        "email" : $(".emailConnectTextBox").val(), 
        "optin" : $(".connectCheckbox").val() 
    },
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (msg) { 
        alert(msg.d); 
    },
    error: function (msg) { 
        alert('Error:' + msg.d); 
    }
});

在泛型处理程序中编写的
响应也应该传递一个JSON字符串

因此，将tgis
context.Response.Write（“插入的电子邮件”）；
更改为
context.Response.Write（{d:'email inserted'}）；

仅此而已。
我首先尝试您的示例，因为它似乎直接解决了我正在尝试的问题。好的，就我的元素而言，它抓取电子邮件地址并提醒我上述所有解决方案都起了作用。现在，ajax部分似乎没有触发代码背后的Web方法。我很高兴它起了作用。至于.ashx代码，这是一个不同的问题，我确信balexandre的答案是完整的，并将帮助您完成其余的工作：）我使用您的解决方案来处理传入的ajax，.ashx文件。它正确启动，但请求对象为空。我假设数据没有正确发送。string email=context.request[“email”]，optin=context.Request[“optin”]；它获取空值…我的ajax调用中是否有不正确的地方？是的，你是对的，你的
数据
也不正确…我编辑我的答案是为了给你正确的数据行，你需要将其更改为空值…它仍然返回为空值…我使用母版页是否重要？它似乎在调用JU后面的代码不好。只是变量没有被传递。感谢您的持续帮助。当您说“确保表单已发布”时，除了类型：“发布”之外，您还有其他意思吗“设置？到目前为止，我已经使用了balexandre和rciq的答案来正确地进行设置。我现在只是在ajax发送正确的内容而不是空值方面遇到了问题。
 $("button").click(function(){
 var content = new Object();
 content.email = $("#email").val();
 content.option = $("#checkbox").val();
 content = JSON.stringify(content);


 $.ajax({
        async: false,
        type: "POST",
        url: aspxPage + "/" + function, //make sure root is set proper.
        contentType: "application/json;",
        data: content,
        dataType: "json",
        success: successFunction,
        error: errorFunction
    });
    });


    //Make sure the form is posted ..which is needed for ajax to submit.
    //the data part in code behind seems ok.

public void Page_Load(...) 
{
    insertEmail();
}

public void inserEmail() {

    string email = Request["email"],
           optin = Request["optin"];

    string strSQL = "INSERT INTO Emails (emailAddress,optIn) VALUES('" + email.ToString() + "', optin)";
    SqlConnection Conn = new SqlConnection(strConnection);
    SqlCommand Command = new SqlCommand(strSQL, Conn);
    Conn.Open();
    Command.ExecuteNonQuery();
    Conn.Close();

    // Output
    Response.Write("email inserted");
}

public class insertEmail : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        string email = context.Request["email"],
               optin = context.Request["optin"];

        string strSQL = "INSERT INTO Emails (emailAddress,optIn) VALUES('" + email.ToString() + "', optin)";
        SqlConnection Conn = new SqlConnection(strConnection);
        SqlCommand Command = new SqlCommand(strSQL, Conn);
        Conn.Open();
        Command.ExecuteNonQuery();
        Conn.Close();

        context.Response.ContentType = "text/plain";
        context.Response.Write("email inserted");
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

data: { 
        "email" : $(".emailConnectTextBox").val(), 
        "optin" : $(".connectCheckbox").val() },

$.ajax({
    type: "POST",
    url: "/asynchronous/insertEmail.ashx",
    data: { 
        "email" : $(".emailConnectTextBox").val(), 
        "optin" : $(".connectCheckbox").val() 
    },
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (msg) { 
        alert(msg.d); 
    },
    error: function (msg) { 
        alert('Error:' + msg.d); 
    }
});

 $("button").click(function(){
 var content = new Object();
 content.email = $("#email").val();
 content.option = $("#checkbox").val();
 content = JSON.stringify(content);


 $.ajax({
        async: false,
        type: "POST",
        url: aspxPage + "/" + function, //make sure root is set proper.
        contentType: "application/json;",
        data: content,
        dataType: "json",
        success: successFunction,
        error: errorFunction
    });
    });


    //Make sure the form is posted ..which is needed for ajax to submit.
    //the data part in code behind seems ok.