JQuery ajax 异步传一个数组到 .net后台

可能使用JQuery Ajax传值到后台一个字符串,或者序列化后的表单大家都使用过,但是某些项目,需要我们一次传值一个数组到后台,这个时候有什么好的办法呢?

1.JS将数组转换为一个字符串,然后传值到后台,不方便

  比如把一个[1,2,3,4,5]的数组,转换为一个 var str="1,2,3,4,5"; 的字符串 ,然后传递到后台后,再用.net的 split(‘,‘) 分离,这样用起来十分别扭,而且还要考虑数组中是否会存在分割字符串的问题

2.使用 JSON.stringify() 方法,方便,简单粗暴。

  昨天晚上小朱又遇到了提交数组的问题,于是和朋友小飞商量了下,之前知道JQuery 有 stringify() 这个方法,也一直不知道咋用,昨天小飞知道小朱这个问题后,教了下小朱这个方法,解决了提交数组的问题

  现学现卖,于是今天和园友们分享这个实用的方法

首先,引入必须的JQuery文件

然后从你的页面中得到一个数组,这根据你的实际需求,可能是用户输入,或者自己从table表格里抓取

比如小朱需要抓取类似 学号,当前边的checkbox被选中时候,就把这个学号,放在数组里

现在小朱得到了一个名字为 arrId 的数组,当然你也可以通过其它方法来拼凑自己的数组,这个不是本文的重点,本文的重点在下面,当你得到这个数组后,如后传递到后台,和后台交互

传递数组嘛,上文就是为了拼凑这样的一个数组:

得到这个数组后,我们使用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();
                        }

                    }
                });

所以,我们需要在本页后台,写一个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";
            }
        }

WebMethod需要引入命名空间:

using System.Web.Services;

那么,按F5就可以正常运行了。

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

上文可能说的比较啰嗦,因为小朱担心朋友们看不懂啦,下边简单做一个总结:

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";
        }        

把这个使用的方法记录下来,分享给朋友们,方便朋友们学习,方便自己以后查阅复习!

时间: 2024-10-10 15:35:01

JQuery ajax 异步传一个数组到 .net后台的相关文章

jQuery ajax如何传多个值到后台页面,举例:

一.js代码 <script type="text/JavaScript">$("#save_change_<{$aff.Id}>").click(function(){//从模态框中取值,并通过ajax传到后台var account = document.getElementById("change_account_<{$aff.Id}>").value;var password = document.get

Jquery Ajax 异步设置Table中某列的值

可根据table中某列中的ID去改变某列的值! JS: 1 $(document).ready(function () { 2 setTimeout(GetDate, 1000); 3 4 }); 5 6 function GetDate() { 7 $("#tbData tbody").find("tr").each(function () { 8 var prjectBalanceObj = $(this).find("td:eq(3)");

详谈 Jquery Ajax 异步处理Json数据.

详谈 Jquery Ajax 异步处理Json数据.

jquery ajax异步调用

写程序的第一步都要知其然,至于知其所以然就要看个人的爱好了.下面说一下web开发中经常用的ajax. 这里是用的jquery框架实现的ajax异步调用.废话少说先上代码.(asp.net开发) var x=""; var y=""; $.ajax({ type: "post", url: "../ashx/RemoveHoliday.ashx", dataType: "json", data: { parm

jQuery Ajax异步

jQuery.form.js插件(博客参考): http://blog.csdn.net/zzq58157383/article/details/7718956 http://www.cnblogs.com/heyuquan/p/form-plug-async-submit.html   ajax分页:http://www.helloweba.com/view-blog-195.html http://www.cnblogs.com/chenping-987123/archive/2011/02

JQuery $.ajax(); 异步访问完整参数

jquery中的ajax方法参数 url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如put和delete也可以使用,但仅部分浏览器支持. timeout: 要求为Number类型的参数,设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设置. async: 要求为Boolean类型的参数,默认设置为true,所有请求均为异步请求.如

jQuery ajax 异步请求

jQuery - AJAX 简介 AJAX 是与服务器交换数据的技术,它在不重载全部页面的情况下,实现了对部分网页的更新. 什么是 AJAX? AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML). 简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示. 关于 jQuery 与 AJAX jQuery 提供多个与 AJAX 有关的方法. 通过 jQuery AJAX 方法,您能够使用 HTTP Get

Jquery ajax异步传值的两个实用的方法,你看后肯定会用第二个

故名思议,你是个asp.net  或者是搞PHP的或者 是javaweb的 ,但是为了提高界面的效率,你必须会实用jquery的ajax,当然,在ajax异步传值的时候很头疼的一件事情就是,拼接字符串json下面给大家演示一个较为普通的拼写json,话不多少 我直接上code $.ajax({ type: "Post", //方法 url: "MsgTongJi.aspx/AreaStu", //url contentType: "application/

asp.net 中使用JQuery Ajax 上传文件

首先创建一个网页,网页中添加如下代码. <h3>Upload File using Jquery AJAX in Asp.net</h3> <table> <tr> <td>File:</td> <td> <asp:FileUpload ID="fupload" runat="server" onchange='prvimg.UpdatePreview(this)' />