.NET Simple Form通过AJAX和JQUERY提交
由于balexandre和rtiq，我得到了流量。 我的.ashx文件被调用，所以我知道一部分代码正在运行，它提醒我一个错误。 当我跟踪.NET时，通过context.Request [“email”]和context.Request [“optin”]引入的变量为NULL。
我知道有些不对劲但我看不到它。 我已经重新编辑了这篇文章，以获得最新的代码。
HEAD中的jQuery
$(document).ready(function () { $(".submitConnectButton").click(function (evt) { evt.preventDefault(); alert("hello click"); alert($(".emailConnectTextBox").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); } }); }); }); HTML
.ashx中的CodeBehind
public class insertEmail : IHttpHandler { public void ProcessRequest(HttpContext context) { string strConnection = System.Configuration.ConfigurationManager.AppSettings["SQLConnectString"].ToString(); string email = context.Request["email"], optin = context.Request["optin"]; string strSQL = "INSERT INTO Emails (emailAddress,optIn) VALUES('" + email.ToString() + "','" + optin.ToString() + "')"; 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; } } }
表格和元素表现得很好。 我们只是获取此NULL值而无法插入。 ajax正在调用.ashx文件并且文件正在编译，请求的变量为空。之前的帮助很棒，如果有人能帮我解决这个问题，你会得到一个金星！ 🙂
经过一些书籍离线搜索后，这最终与balexandres .aspx方法结合使用：
解
$.post("/asynchronous/addEmail.aspx", {email: $(".emailConnectTextBox").val(),optin: $(".connectCheckbox").is(':checked')}, function(data) { alert('Successful Submission');});
- 在您的网站根目录中创建一个名为
asynchronous的新文件夹 - 创建一个名为
addEmail.aspx的新aspx页面并删除除第1行以外的所有HTML - 在
addEmail.aspx里面放置你的代码，比如：
。
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"); }
-
在您的主页面中，具有
.ajax()调用将url属性更改为url: "/asynchronous/insertEmail.aspx",
您将在msg中success: function (msg) {} email inserted的字符串email inserted
这是我经常做的，但是，我使用的ASHX（Generic Handler）页面不包含任何ASP.NET页面循环（加载速度更快）而不是创建ASPX页面，而且它是一个简单的页面。
如果你想使用Generic Handler ，在asynchronous文件夹里面创建一个名为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属性也不正确。
正确的是：
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); } });
并且通用处理程序中的Response.Write应传递JSON字符串
所以，改变tgis context.Response.Write("email inserted"); into context.Response.Write("{d:'email inserted'});
就这样。
$("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.
您的html代码中没有表单，因为您可能不使用提交。 使用click代替rciq写道。
尝试改变这个：
$("#connectButton").submit(function () { alert("hello click"); (...)
对此：
$("#connectButton").click(function (evt) { evt.preventDefault(); alert("hello click"); (...)
此外，您必须记住ASP.NET服务器控件的ID与呈现的DOM控件ID不同。 这可能是您的警报无法触发的原因。 如果您在与服务器控件相同的页面上编写客户端脚本，则可以通过以下方式在脚本标记内“呈现”ClientID：
$("<%= connectButton.ClientID %>").click( ...
另一件事。 如果在HEAD脚本中使用jQuery选择，则可能会过早地找到控件。 您应该在创建DOM控件后运行它们。 要完成的一件事是使用’ready’事件：