JQuery Form AjaxSubmit(options)在Asp.net中的应用注意事项

所需引用的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();
            }

时间: 2024-08-06 20:01:32

JQuery Form AjaxSubmit(options)在Asp.net中的应用注意事项的相关文章

在 ASP.NET 中使用 jQuery.load() 方法

今天就让我们看看在 ASP.NET 中使用 jQuery.load() 方法来调用 ASP.NET 的方法,实现无刷新的加载数据. 使用 jQuery 的朋友应该知道可以使用 jQuery.load() 加载静态页面,并可指定要加载的区域,如在"test.html"中有如下内容: <div id="show"> <a href="http://www.jquery001.com/">jQuery001</a>

asp.net中的App_GlobalResources和App_LocalResources使用

学而不思则罔,思而不学则殆,每天坚持一小步,则成功一大步 App_GlobalResources是全局资源文件夹,主要存放一些所有页面都需要用到的信息.App_LocalResources是本地资源文件夹,主要存放的是该页面所要用到的字符串和信息. 首先我们来看一下在VS中怎么创建和使用全局资源和本地资源,首先打开VS,新建一个网页项目,然后在单击该网站项目,然后单击右键,新建文件夹App_GlobalResources和App_LocalResources 然后在App_GlobalResou

jQuery form插件的使用--ajaxForm()和ajaxSubmit()的可选参数项对象

一.前提说明 Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 二.简单介绍 本文演示的是:jQuery form插件的使用--ajaxForm()和ajaxSubmit()的可选参数项对象 $('#myForm').ajaxForm(function() { $('#output1').html("提交成功!欢迎下次再来!").show(); }); $('#myForm2').sub

jQuery form插件----ajaxForm()和ajaxSubmit()方法的使用

我们在平常使用jQuery异步提交表单,一般是在submit()中,使用$.ajax进行.比如: $(function(){ $("#form1").submit(function(){ $.ajax({ url : url, data : $("#form1").serialize(), dataType : "json", success : function(data){ alert(data);} }); }); }); 这样的方式掩盖了

jquery.form.js提交 input file中的文件

现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件,解决方案: 下面说说 jquery.form.min.js 插件,它是一款优秀的Ajax表单插件,我们可以非常容易的使用它处理表单控件的值,清空和复位表单控件,附件上传,以及完成Ajax表单提交.jquery.form.min.js 有两个核心方法ajaxForm()和ajaxSubmit(),下面以实例来简单说明其提交file文件方式: <!-- Modal:

jquery.form.js的ajaxSubmit和ajaxForm使用

依赖的脚本文件 1 <script src="../Javascript/jquery-1.11.1.min.js" type="text/javascript"></script> 2 <script src="../Javascript/jquery.form.js" type="text/javascript"></script> ajaxSubmit 和ajaxForm区

[Asp.net mvc]jquery.form.js无刷新上传

写在前面 最近在自己的网盘项目中想用ajax.beginform的方式做无刷新的操作,提交表单什么的都可以,但针对文件上传,就是个鸡肋.在网上查找了发现很多人都遇到了这个问题,大部分都推荐使用jquery.form.js的插件实现. demo 首先通过nuget安装插件jquery.form.js 引入js文件 <script src="~/Scripts/jquery.form.min.js"></script> 前端调用的代码 @{ ViewBag.Titl

关于jQuery.form中formSerialize()等函数的适用对象

几个月前写一个页面,要用到Ajax提交,于是写了几行jQuery: …… var formData = $("form")[0].formSerialize(); …… 然后死活调不通……这一句总说“对象不支持该方法” 无奈,给form对象分了个id,然后改成这样: …… var formData = $("#main-form").formSerialize(); …… 总算是过了. 最近要改一个框架,又要Ajax提交,于是把原来的句子抄了过来. 框架嘛,总要有点

asp.net中ScriptManager自带Ajax与jQuery事件冲突

问题引诉:最近在使用asp.net自带的无刷新提交ScriptManager时,发现一个问题,就是和我自己用jQuery写的一些事件函数和局部刷新相冲突.通过在网上收索,发现很多人都遇到这个同样的问题.最终还是找到的解决的办法,在此我想将其解决的办法分享出来供大家参考. 问题解决办法: 方法1.两者实现都能够实现页面的无刷新效果,所以可以保留其中的一种即可: 方法2.如果必须要两者混合应用,那么在用jQuery绑定事件是就要注意一些了 我们平时在jQuery中绑定事件最常用的方式有以下三种:以c