JQuery Form AjaxSubmit(options)在Asp.net中的应用注意事项
2012-03-23 16:24
716 查看
所需引用的JS:
在http://www.malsup.com/jquery/form/#download 下载:http://malsup.github.com/jquery.form.js
在http://jquery.com/ 下载:http://code.jquery.com/jquery-1.7.2.min.js
注意事项:
//dataType: "json", //get的方式再设置此属性
//注意:from 如果是 runat="server" 那option的url只能是提交给自己的.aspx,如果不是则可以提交给其他.aspx接收。
//注意:from中的<input 标签 必须带有name属性,否则只有id Request.Form[] 会获得不到后增加的标签。//不先Clear的话会返回整个页面的html文件内容,也不要用Response.Write();应该是:HttpContext.Current.Response.Write,注意HttpContext.Current.Response.ContentType = "text/html";
HttpContext.Current.Response.Clear();
示例代码:
aspx页<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqueryFormAjaxSubmit.aspx.cs" Inherits="GaryTestPro.JqueryFormAjaxSubmit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<script type="text/javascript" src="JS/JQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="JS/JQuery/jquery.form.js"></script>
<script type="text/jscript"language="jscript">
function SubInfo() {
$("#Order").append("<input name=txtDns value=\"DNS解析\" id=txtDns type=\"text\" />");
$("#Order").append("<input name=txtIP value=\"IP地址\" id=txtIP type=\"text\" />");
var options = {
beforeSubmit: function() {
return true;
},
url: 'JqueryFormAjaxSubmit.aspx?Mode=SF',
type: 'POST',
//dataType: "json", //get的方式再设置此属性
success: function(data) {
if (data == "") {
document.getElementById('Order').style.display = "none";
alert("操作成功!");
}
else {
alert(data);
}
},
error: function() {
//请求出错处理
alert("error");
}
};
//注意:from 如果是 runat="server" 那option的url只能是提交给自己的.aspx,如果不是则可以提交给其他.aspx接收。
//注意:from中的<input 标签 必须带有name属性,否则只有id Request.Form[] 会获得不到后增加的标签。
$("#form1").ajaxSubmit(options);
}
</script>
</head>
<body>
<form id="form1" runat="server" method="post">
<div>
<div id="Order">
</div>
<input name="txtName" value="星期一" id="txtName" type="text" />
<input name="txtUser" value="星期二" id="txtUser" type="text" />
<a href="javascript:void(0);" onclick="SubInfo();">提交</a>
</div>
</form>
</body>
</html> aspx.cs 代码:
protected void Page_Load(object sender, EventArgs e)
{
if (Request.Form["txtName"] != null)
{
string sName = Request.Form["txtName"].ToString();
}
if (Request.Form["txtDns"] != null)
{
string sDns = Request.Form["txtDns"].ToString();
//不先Clear的话会返回整个页面的html文件内容
HttpContext.Current.Response.Clear();
HttpContext.Current.Response.ContentType = "text/html";
HttpContext.Current.Response.Write("{result:true}");
HttpContext.Current.Response.End();
}
}
在http://www.malsup.com/jquery/form/#download 下载:http://malsup.github.com/jquery.form.js
在http://jquery.com/ 下载:http://code.jquery.com/jquery-1.7.2.min.js
注意事项:
//dataType: "json", //get的方式再设置此属性
//注意:from 如果是 runat="server" 那option的url只能是提交给自己的.aspx,如果不是则可以提交给其他.aspx接收。
//注意:from中的<input 标签 必须带有name属性,否则只有id Request.Form[] 会获得不到后增加的标签。//不先Clear的话会返回整个页面的html文件内容,也不要用Response.Write();应该是:HttpContext.Current.Response.Write,注意HttpContext.Current.Response.ContentType = "text/html";
HttpContext.Current.Response.Clear();
示例代码:
aspx页<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqueryFormAjaxSubmit.aspx.cs" Inherits="GaryTestPro.JqueryFormAjaxSubmit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<script type="text/javascript" src="JS/JQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="JS/JQuery/jquery.form.js"></script>
<script type="text/jscript"language="jscript">
function SubInfo() {
$("#Order").append("<input name=txtDns value=\"DNS解析\" id=txtDns type=\"text\" />");
$("#Order").append("<input name=txtIP value=\"IP地址\" id=txtIP type=\"text\" />");
var options = {
beforeSubmit: function() {
return true;
},
url: 'JqueryFormAjaxSubmit.aspx?Mode=SF',
type: 'POST',
//dataType: "json", //get的方式再设置此属性
success: function(data) {
if (data == "") {
document.getElementById('Order').style.display = "none";
alert("操作成功!");
}
else {
alert(data);
}
},
error: function() {
//请求出错处理
alert("error");
}
};
//注意:from 如果是 runat="server" 那option的url只能是提交给自己的.aspx,如果不是则可以提交给其他.aspx接收。
//注意:from中的<input 标签 必须带有name属性,否则只有id Request.Form[] 会获得不到后增加的标签。
$("#form1").ajaxSubmit(options);
}
</script>
</head>
<body>
<form id="form1" runat="server" method="post">
<div>
<div id="Order">
</div>
<input name="txtName" value="星期一" id="txtName" type="text" />
<input name="txtUser" value="星期二" id="txtUser" type="text" />
<a href="javascript:void(0);" onclick="SubInfo();">提交</a>
</div>
</form>
</body>
</html> aspx.cs 代码:
protected void Page_Load(object sender, EventArgs e)
{
if (Request.Form["txtName"] != null)
{
string sName = Request.Form["txtName"].ToString();
}
if (Request.Form["txtDns"] != null)
{
string sDns = Request.Form["txtDns"].ToString();
//不先Clear的话会返回整个页面的html文件内容
HttpContext.Current.Response.Clear();
HttpContext.Current.Response.ContentType = "text/html";
HttpContext.Current.Response.Write("{result:true}");
HttpContext.Current.Response.End();
}
}
相关文章推荐
- 应用ASP.NET AJAX的注意事项
- 使用ASP.NET AJAX的注意事项
- 应用HttpHandler, Json, JQuery, ASP.Net UserControl等技术处理 Ajax 的解决方案
- 通过jquery dialog为什么提交不了form表单 和 $("#Form").ajaxSubmit(options) is not a function 的原因
- jQuery Form 表单提交插件-----ajaxSubmit() 的应用
- 使用Asp.net MVC, Jquery, Jquery UI构建基于Ajax的RIA应用.(更新Demo下载)
- 使用ASP.NET AJAX的注意事项
- 使用Jquery应用到Asp.net ajax中时3个误区应该避免
- 64位系统使用VS2010开发32位ASP.NET应用--注意事项
- 使用ASP.NET AJAX的注意事项
- 使用Jquery应用到Asp.net ajax中时3个误区应该避免
- 使用ASP.NET AJAX的注意事项
- asp.net core mvc ajaxform submit files
- Asp.net MVC +JQueryValidation + AjaxForm
- Asp.net中Split函数的应用及注意事项。
- Asp.net MVC +JQueryValidation + AjaxForm
- asp.net 在chrome下 jquery.validate form.submit无效果
- [导入]使用ASP.NET AJAX的注意事项
- JQuery Form Ajax提交Asp.Net表单时的验证视图状态 MAC 失败
- JQuery Form Ajax提交asp.net表单时失败