接下来传值到后台,也正如好管理. 即使ajax央求非常多

兴许使用JQuery
Ajax传值到后台三个字符串,恐怕种类化后的表单我们都利用过,不过某个品种,须求大家二回传值贰个数组到后台,那一年有怎样好的艺术吧?

在今后我们在做ajax时,都要依附日常管理程序(.ashx)或web服务(.asmx),何况每贰个呼吁都要建三个如此的文件.那样建第一次全国代表大会堆ashx文件,相比较麻烦,多了看起来也不爽.

1.JS将数组调换为贰个字符串,然后传值到后台,不方便人民群众

当今大家能够借助webMethod方法来使ajax实现起来更为简便易行

  比方把一个[1,2,3,4,5]的数组,转变为四个 var str=”1,2,3,4,5″;
的字符串 ,然后传递到后台后,再用.net的 split(‘,’)
分离,那样用起来万分同室操戈,并且还要考虑数组中是或不是会存在分割字符串的主题素材

1,既然要用WebMethod,这确定就必须引用一下命名空间了

2.应用 JSON.stringify() 方法,方便,轻便冷酷。

using System.Web.Services;

  前日中午小朱又遇见了交给数组的标题,于是和恋人小飞商量了下,此前知道JQuery
有 stringify()
那一个点子,也一贯不知情咋用,后天小飞知道小朱这么些标题后,教了下小朱那一个措施,消除了付出数组的主题素材

在此地,为便于开拓,小编新建了二个页面特意用于写WebMethod方法.那样会相比低价,也正如好管理. 假如ajax须求相当多,能够多建多少个页面.根据页面的名号来作下央浼的归类
例,下边贴出后台代码:

  现学现卖,于是后日和园友们享受这么些实用的措施

/// <summary> 
/// 根据任务ID获取任务名称,任务完成状态,任务数量 
/// </summary> 
/// <param name="id">任务ID</param> 
/// <returns></returns> 
[WebMethod] 
public static string GetMissionInfoById(int id) 
{ 
CommonService commonService = new CommonService(); 
DataTable table = commonService.GetSysMissionById(id); 
    //..... 
return "false"; 
} 

 

后台的这么些WebMethod方法需要是集体的静态方法,方法方面注意要加上WeMethod属性;若是要在那么些办法里面操作Session.就得在艺术上增多属性

第一,引进必需的JQuery文件

[WebMethod(EnableSession = true)]//或[WebMethod(true)] 
public static string GetMissionInfoById(int id) 
{ 
CommonService commonService = new CommonService(); 
DataTable table = commonService.GetSysMissionById(id); 
    //..... 
return "false"; 
} 

图片 1

2.既然后台的WebMethod方法都曾经写好了.就差着调用了.这里就用JQuery吧.比较简略

 

$.ajax({ 
type: "POST", 
contentType: "application/json", 
url: "WebMethodAjax.aspx/GetMissionInfoById", 
data: "{id:12}", 
dataType: "json", 
success: function() 
   { 
     //请求成功后的回调处理. 
   }, 
   error:function() 
{ 
//请求失败时的回调处理. 
} 
}); 

图片 2

此处对Jquery的Ajax多少个参数做一下粗略的认证,type:伏乞的体系,这里不可不用post
。WebMethod方法只接受post类型的乞请

 

contentType:发送音信至服务器时内容编码类型。大家这里断定要用application/json

 然后从你的页面中收获多少个数组,那根据你的实在须要,或然是客商输入,可能自身从table表格里抓取

url:诉求的劳务器端管理程序的渠道,格式为”文件名(含后缀)/方法名”

图片 3

data:参数列表。注意,这里的参数一定倘诺json格式的字符串,记住是字符串格式,如:”{aa:11,bb:22,cc:33
, …}”。

 

一经你写的不是字符串,那jquery会把它实系列化成字符串,那么在服务器端接受到的就不是json格式了,且无法为空,即便未有参数也要写成”{}”,如上例。相当多个人不成功,原因就在此地。

 举例小朱供给抓取类似
学号,当后边的checkbox被选中时候,就把那个学号,放在数组里

dataType:服务器再次回到的数据类型。必得是json,其余的都没用。因为webservice
是一json格式再次回到数据的,其情势为:{“d”:”…….”}。  success:央浼成功后的回调函数。你能够在这里对回到的数量做放肆管理。

图片 4

咱俩得以见见里边有的参数值是稳固的,所以从复用性的角度思索,大家得以给jquery做一个恢宏,对地方的函数做一下轻易的包装:大家建一个本子文件叫jquery.extend.js。在里头写叁个叫ajaxWebService的秘诀(因为webmethod其实正是WebService嘛,故此方法对央浼*.asmx也是立竿见影的),代码如下:

至今小朱获得了二个名为 arrId
的数组,当然你也得以透过别的方式来拼凑自身的数组,这些不是本文的第一,本文的第一在上面,当您获得那几个数组后,如后传递到后台,和后台交互

///<summary> 
///jQuery原型扩展,重新封装Ajax请求WebServeice 
///</summary> 
///<param name="url" type="String">处理请求的地址</param> 
///<param name="dataMap" type="String">参数,json格式的字符串</param> 
///<param name="fnSuccess" type="Function">请求成功后的回调函数</param> 
$.ajaxWebService = function(url, dataMap, fnSuccess) { 
$.ajax({ 
type: "POST", 
contentType: "application/json", 
url: url, 
data: dataMap, 
dataType: "json", 
success: fnSuccess 
}); 
} 

传送数组嘛,上文正是为着拼凑那样的三个数组:

好了,那样大家央浼webmethod方法 就可以这么调用了:

图片 5

$.ajaxWebService("WebMethodAjax.aspx/GetMissionInfoById", "{id:12}", function(result) {//......}); 

取得那些数组后,我们应用ajax传递到后台:

上边再贴一种包装,是先前跟一老总时,看的他的封装.以为还不易

 //2.传后台
                $.ajax({
                    type: "Post",
                    url: "manager.aspx/DeleteMore",
                    data: JSON.stringify({ arr: arrId }),
                    contentType: "application/json;charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        if (data.d == "Y") {
                            alert("批量删除成功!");
                            window.location.reload();
                        }

                    }
                });

第一也是建多少个js文件,文件名随你们起了.笔者这里就建了贰个CommonAjax.js里面多少个格局,看上边代码:

 

function json2str(o) { 
var arr = []; 
var fmt = function(s) { 
if (typeof s == 'object' && s != null) return json2str(s); 
return /^(string|number)$/.test(typeof s) ? "'" + s + "'" : s; 
} 
for (var i in o) arr.push("'" + i + "':" + fmt(o[i])); 
return '{' + arr.join(',') + '}'; 
} 
function Invoke(url, param) { 
var result; 
$.ajax({ 
type: "POST", 
url: url, 
async: false, 
data: json2str(param), 
contentType: "application/json; charset=utf-8", 
dataType: "json", 
success: function(msg) { 
result = msg.d; 
}, 
error: function(r, s, e) { 
throw new Error(); 
} 
}); 
return result; 
} 

之所以,大家必要在本页后台,写四个WebMethod(小编的这些页面名字叫做manage.aspx,请读者朋友依照自个儿的页面记得相应退换)

咱俩在前台的调用就相比较轻巧了.

[WebMethod]
        public static string DeleteMore(List<string> arr)
        {
            StringBuilder sb = new StringBuilder();
            foreach (var item in arr)
            {
                sb.Append(item + ",");
            }
            sb.Remove(sb.Length - 1, 1);

            string sqlDelete = "UPDATE stuapply_Info  SET Status=1 WHERE ApplyId IN (" + sb.ToString() + ")";

            int r = DBUtility.DbHelperSQL.ExecuteSql(sqlDelete);

            if (r > 0)
            {
                return "Y";
            }
            else
            {
                return "N";
            }
        }
var result = Invoke("WebMethodAjax.aspx/GetMissionInfoById", { "name": arguments.Value, "id": id }); 

WebMethod需求引进命名空间:

但是倘诺用如此形式的话.在给后台WebMethod方法传参时要注意一点.Json的key必须跟WebMethod方法的形参一样,还会有参数的依次不可乱.不然会呈请失利.

using System.Web.Services;

比方后台的措施如下:

 

[WebMethod] 
public static string GetMissionInfoById(int Id,string name) 
{ 
   //.....  
return "false"; 
} 

那么,按F5就能够健康运作了。

我们要传七个参数,格式就按: 

 

[csharp] view plain copy print?
{"Id":23,"name":"study"} 

 

上述所述是小编给我们介绍的行使Jquery Ajax
央浼webservice来达成更简约的Ajax,希望对大家具备助于,若是大家有别的疑问请给自个儿留言,笔者会及时还原大家的。在此也特别多谢大家对剧本之家网址的帮忙!

===========总结============

 

上文只怕说的相比较啰嗦,因为小朱忧郁朋友们看不懂啦,上边轻松做贰个总括:

1.引入JS文件

2.拼凑出来一个数组

3.ajax后台交互

 $.ajax({
                    type: "Post",
                    url: "页面名.aspx/load",
                    data: JSON.stringify({ arr: arrId }),
                    contentType: "application/json;charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                         alert("操作成功!");
                        }

                    }
                });    

4.后台引入命名空间,写WebMethod

[WebMethod]
        public static string load(List<string> arr)
        {
            StringBuilder sb = new StringBuilder();
            foreach (var item in arr)
            {
                sb.Append(item + ",");
            }
            sb.Remove(sb.Length - 1, 1);

           //sb.ToString() 为 1,2,3,4 可以用在SQL语句的WHERE ... IN ...


            //当然你也可以根据自己的业务逻辑不同,使用List<string>

            //记得最后要 return "Y"; 
        }        

 

把那一个利用的点子记录下来,分享给情大家,方便朋友们上学,方便温馨之后翻看复习!

 

您恐怕感兴趣的小说: