AJAX JQuery 调用后台方法返回值（不刷新页面）
AJAX JQuery 调用后台方法返回值（不刷新页面）
（1）无参数返回值（本人亲试返回结果不是预期结果）
javascript方法：
$(function () {
//无参数返回值
$("#btn_Ajax1").click(function () {
$.ajax({
type: "Post",
//方法所在页面和方法名
url:
"Ajax_Test.aspx/getValueByAjaxNoParms",
contentType: "application/json; charset=utf-8",
dataType: "json",
beforeSend: function (XMLHttpRequest) {
$('#show').text("正在查询");
},
success: function (data) {
//返回的数据用data.d获取内容
alert(data.d);
},
error: function (err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
后台方法：
//[System.Web.Services.WebMethod()]
//不带参数
[WebMethod()]
public static string getValueByAjaxNoParms()
{
string ddd = "返回 GAGAHJT";
return ddd.ToString();
}
（2）带参数返回值
javascript方法：
//带参数
$("#btn_Ajax2").click(function () {
$.ajax({
type: "Post",
url: "Ajax_Test.aspx/getValueByAjaxByParms",
//方法传参的写法一定要对，str为形参的名字,str2为第二个形参的名字
data: "{'str':'我是','str2':'XXX','str3':'是不是？'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//返回的数据用data.d获取内容
alert(data.d);
},
error: function (err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
后台方法：
//带参数
[WebMethod]
public static string getValueByAjaxByParms(string str, string str2,
string str3)
{
return str + str2 + str3;
}
（3）返回数组
javascript方法：
//返回数组
$("#btn_Ajax3").click(function () {
$.ajax({
type: "Post",
url: "Ajax_Test.aspx/getArrayByAjax",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//插入前先清空ul
$("#show").html("");
//递归获取数据
$(data.d).each(function () {
//插入结果到li里面
$("#show").append("<li>" + this +
"</li>");
});
alert(data.d);
},
error: function (err) {
alert(err);
}
});
//禁用按钮的提交
return false;
});
后台方法：
//返回数组
[WebMethod]
public static List<string>
getArrayByAjax()
{
List<string> li = new
List<string>();
for (int i = 0; i < 10; i++)
li.Add(i + "");
return li;
}
（4）返回hashtable
javascript方法：
//返回hashtable
$("#btn_Ajax4").click(function () {
$.ajax({
type: "Post",
url: "Ajax_Test.aspx/geHashtableByAjax",
//记得加双引号
T_T
data: "{ 'key': 'haha', 'value': '哈哈！' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//debugger;
alert("key: haha ==> " + data.d["haha"] + "\n key:
www ==> " + data.d["www"]);
},
error: function (err) {
alert(err + "err");
}
});
//禁用按钮的提交
return false;
});
后台方法：
//Hashtable
[WebMethod]
public static Hashtable geHashtableByAjax(string key, string
value)
{
Hashtable hs = new Hashtable();
hs.Add("www", "yahooooooo");
hs.Add(key, value);
return hs;
}
（5）返回DataTable
javascript方法：
//返回DataTable（json）1
$("#btn_Ajax5").click(function () {
$.ajax({
type: "Post",
url: "Ajax_Test.aspx/geDataTableByAjax1",
data: "{'str':'我是','str2':'XXX','str3':'是不是？'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//debugger;
//你可以
alert(data.d)看数据返回的格式
data = jQuery.parseJSON(data.d);
// JSON再次转换为Table
形式；
//可以是用
data[Row][Column].toString()来读取值；Row：第几行
Column：数据字段
//alert(data[0]["ID"].toString() + ";"+data[0]["Name"].toString() +
";"+data[0]["Address"].toString());
t = "<table border='1'>";
$.each(data, function (i, item) {
t += "<tr>";
t += "<td>" + item.ID +
"</td>";
t += "<td>" + item.Name +
"</td>";
t += "<td>" + item.Address +
"</td>";
t += "</tr>";
})
t += "</table>";
$("#show").html(t);
//$('#Div1').html(BuildDetails(data));
},
error: function (err) {
alert(err + "err");
}
});
//禁用按钮的提交
return false;
});
后台方法：
//Json
//在前台通过jQuery.parseJSON(data.d); 转换为类似Table
[WebMethod]
public static string geDataTableByAjax1(string str, string str2,
string str3)
{
DataTable dt = new DataTable();
dt.TableName = "表名";
dt.Columns.Add("ID", typeof(Int32));
dt.Columns.Add("Name", typeof(string));
dt.Columns.Add("Address", typeof(string));
for (int i = 0; i < 5; i++)
{
DataRow dr = dt.NewRow();
dr["ID"] = i.ToString();
dr["Name"] = "JSON" + i.ToString();
dr["Address"] = "中国-北京-海淀" + i.ToString() + "号";
dt.Rows.Add(dr);
}
string strss = Dtb2Json(dt).ToString();
return strss.ToString();
}
（5）返回DataTable
javascript方法：
//返回DataTable（json）2
$("#btn_Ajax6").click(function () {
$.ajax({
type: "post",
url: "Ajax_Test.aspx/geDataTableByAjax2",
//data:
"{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
//debugger;
var mydts = data.d.mytablename;
//这里也可以接受类似 DataSet
的对象；
$('#Div1').html(BuildDetails(mydts));
$('#Div2').html(BuildTable(mydts));
},
failure: function () {
alert("error")
}
});
});
});
后台方法：
//json
[WebMethod]
public static Dictionary<string,
object> geDataTableByAjax2()
{
DataTable dt = new DataTable();
dt.TableName = "mytablename";
dt.Columns.Add("ID", typeof(Int32));
dt.Columns.Add("Name", typeof(string));
dt.Columns.Add("Address", typeof(string));
for (int i = 0; i < 5; i++)
{
DataRow dr = dt.NewRow();
dr["ID"] = i.ToString();
dr["Name"] = "JSON" + i.ToString();
dr["Address"] = "中国-北京-海淀" + i.ToString() + "号";
dt.Rows.Add(dr);
}
return DatToJson(dt);
}
前台数据转换方法
//解析DataTable(非真正的Table)
function BuildDetails(dataTable) {
var content = [];
for (var row in dataTable) {
for (var column in dataTable[row]) {
content.push("<tr>");
content.push("<td><b>");
content.push(column);
content.push("</td></b>");
content.push("<td>");
content.push(dataTable[row][column]);
content.push("</td>");
content.push("</tr>");
}
}
var top = "<table border='1'
class='dvhead'>";
var bottom = "</table>";
return top + content.join("") + bottom;
}
function BuildTable(dataTable) {
var headers = [];
var rows = [];
//column
headers.push("<tr>");
for (var column in dataTable[0])
headers.push("<td><b>"
+ column +
"</b></td>");
headers.push("</tr>");
//row
for (var row in dataTable) {
rows.push("<tr>");
for (var column in dataTable[row]) {
rows.push("<td>");
rows.push(dataTable[row][column]);
rows.push("</td>");
}
rows.push("</tr>");
}
var top = "<table border='1'
class='gvhead'>";
var bottom = "</table>"; return top +
headers.join("") + rows.join("") + bottom;
}
后台数据转换方法
#region DataTable转Json
public static string Dtb2Json(DataTable dtb)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
ArrayList dic = new ArrayList();
foreach (DataRow row in dtb.Rows)
{
Dictionary<string, object> drow = new
Dictionary<string, object>();
foreach (DataColumn col in dtb.Columns)
{
drow.Add(col.ColumnName, row[col.ColumnName]);
}
dic.Add(drow);
}
return jss.Serialize(dic);
}
#endregion
#region Json转DataTable
public static DataTable Json2Dtb(string json)
{
JavaScriptSerializer jss = new JavaScriptSerializer();
ArrayList dic =
jss.Deserialize<ArrayList>(json);
DataTable dtb = new DataTable();
if (dic.Count > 0)
{
foreach (Dictionary<string, object>
drow in dic)
{
if (dtb.Columns.Count == 0)
{
foreach (string key in drow.Keys)
{
dtb.Columns.Add(key, drow[key].GetType());
}
}
DataRow row = dtb.NewRow();
foreach (string key in drow.Keys)
{
row[key] = drow[key];
}
dtb.Rows.Add(row);
}
}
return dtb;
}
#endregion
#region DataTable转Json(非Json)
//类似前台jQuery.parseJSON（dt）函数
private static Dictionary<string,
object> DatToJson(DataTable table)
{
Dictionary<string, object> d = new
Dictionary<string, object>();
d.Add(table.TableName, RowsToDictionary(table));
return d;
}
private static
List<Dictionary<string,
object>> RowsToDictionary(DataTable
table)
{
List<Dictionary<string,
object>> objs = new
List<Dictionary<string,
object>>();
foreach (DataRow dr in table.Rows)
{
Dictionary<string, object> drow = new
Dictionary<string, object>();
for (int i = 0; i < table.Columns.Count; i++)
{
drow.Add(table.Columns[i].ColumnName, dr[i]);
}
objs.Add(drow);
}
return objs;
}
#endregion
AJAX JQuery 调用后台方法返回值（不刷新页面）的更多相关文章
- AJAX回调(调用后台方法返回数据)
记得先要导入jquery.js. 格式一 $.ajax({"Key1":"value1","key2":"value2" ...
- 前台JS(Jquery)调用后台方法 无刷新级联菜单示例
前台用AJAX直接调用后台方法,老有人发帖提问,没事做个示例 下面是做的一个前台用JQUERY,AJAX调用后台方法做的无刷新级联菜单 http://www.dtan.so CasMenu.aspx页 ...
- jQuery调用后台方法
前台: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.as ...
- jQuery 调用后台方法（net）
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs ...
- 调用js方法返回值为undefined
问题描述: 我写的js方法: function getname(code){ var name $.post("",{ code:code },function(resurlt){ ...
- Ajax前台调用后台方法、AJAX Pro2(回调函数)
//获取分店 function cityResult() { if (cityName != "") { $("#ddlcity_").find("o ...
- Ajax - 异步调用后台程序 -JSON
在ASP.NET使用ajax时基本上每个操作都要新建一个.ashx处理程序,页面很多,每个页面的操作也很多,这样的话项目就会产生新建很多很多的.ashx页面,能不能把方法写在后台中,然后Jquery直 ...
- Asp.net中JQuery、ajax调用后台方法总结
通过上一篇文章实例的实现,整个过程当中学习到很多知识点,了解了Jquery.Ajax在asp.net中的运用,加以总结,其实原理都是一样的,理解了一种,其他的注意很少的区别就可以了.灵活运用: 1.有 ...
- asp.net如何在前台利用jquery Ajax调用后台方法
一 :最近因为帮同事开发项目使用到了asp.net,而我又想实现Ajax异步请求....从网上查询了一下资料之后,原来在asp.net中利用Ajax调用后台方法同样很简单,为了便于自己以后查看,特将此 ...
随机推荐
- js的事件属性方法一览表
event对象常用属性和方法 event 对象用来表示当前事件,事件有很多状态,例如,鼠标单击时的位置,按下键盘时的按键,发生事件的HTML元素,是否执行默认动作,是否冒泡等,这些都是作为event对 ...
- c# 自定义位数生成激活码
Random random = new Random(~unchecked((int)DateTime.Now.Ticks));private string CreateAndCheckCode(Ra ...
- oracle中set define off
set define off关闭替代变量功能 在SQL*Plus中默认的"&"表示替代变量,也就是说,只要在命令中出现该符号,SQL*Plus就会要你输入替代值.这就意味着 ...
- TextField的所有属性和方法（转）
转自:http://tsyouaschen.iteye.com/blog/600255 表一 TextField 对象的方法 方法 说明TextField.addListener 加入接收触发事件如文 ...
- C#4 for循环 迭代法 穷举法应用
for()循环. 四要素: 初始条件,循环条件,状态改变,循环体. 执行过程: 初始条件--循环条件--循环体--状态改变--循环条件.... 注意:for的小括号里面分号隔开,for的小括号后不要加 ...
- 库函数strlen源码重现及注意问题
首先直接上源码: size_t strlen (const char * str) { const char *eos = str; while(*eos++); return(eos - str - ...
- Ubuntu 12.04 wireless networks : devices not ready (firmware missing)解决办法
今天装了Ubuntu12.04之后,发现无线不能用. 用iwconfig查看,wlan0 项后面有内容,但是在本该显示无线列表的地方显示的是 “ wireless networks : devices ...
- js 概念（构造函数）
所有关于类.对象的语言里面,都有构造函数的概念,其实构造函数,就是在创建这个对象或者类的实例时候自动调用的函数,一般的语言都是new创建,那么new的参数就传递给构造函数.
- GetLastError来获得错误信息转成文本描述
我们一般在调用了一些API后都会用GetLastError来获得错误信息,但是信息都是Integer的,我们知道是什么意思么?嘿嘿,是的,有msdn呀,当然还可以用FormatMessage函数来.正 ...
- Firebug入门指南（转）
据说,对于网页开发人员来说,Firebug是Firefox浏览器中最好的插件之一. 我最近就在学习怎么使用Firebug,网上找到一篇针对初学者的教程,感觉比较有用,就翻译了出来. 作者:Estell ...