本文目录一览:
- 1、Ajax调用restful接口传送Json格式数据的方法
- 2、ajax如何传递json格式的参数
- 3、js ajax怎么传送json数据
- 4、ajax传递json,然后服务器接受json的代码编写
- 5、如何使用ajax将json传入后台数据
Ajax调用restful接口传送Json格式数据的方法
ajax传送json格式数据,关键是指定contentType,data要是json格式
如果是restful接口,把type改成对应的post(增)、delete(删)、put(改)、get(查)即可
var
post_data={"name":"test001","pass":"xxxx"};
$.ajax({
url:
"",
type:
'post',
contentType:
"application/json;
charset=utf-8",
data:JSON.stringify(post_data),
success:function
(data)
{
//调用成功
},
error:
function(data,
textStatus,
errorThrown){
//调用失败
}
});
以上所述是小编给大家介绍的Ajax调用restful接口传送Json格式数据的方法的全部叙述,希望对大家有所帮助,如果大家想了解更多内容敬请关注脚本之家网站!
ajax如何传递json格式的参数
Ajax中传递Json格式的参数
$.ajax({
type: "post",
url: baseUrl+"sys/login",
dataType: "json",
contentType: "application/json;charset=utf-8",
data: JSON.stringify({userName: loginapp.userName,userPassword: loginapp.userPassword}),
或者拼接字符串的形式:
data: "{'userName': '"+loginapp.userName+"','userPassword': '"+loginapp.userPassword+"'}",
js ajax怎么传送json数据
JSONArray json = JSONArray.fromObject(models); //list集合数据转json
response.getWriter().println(json);//传到前台
//ajax
success: function(data){
var models = eval("("+data+")");
var rows="";
for(var i in models){
rows =rows + "tr"+
"td"+models[i].statDate+"/td"+
"td"+models[i].endDate+"/td"+
"td"+models[i].name+"/td"+
"/tr" ;
}
$("#show_table").append(rows);//添加到table
PS:这是Servlet的写法
ajax传递json,然后服务器接受json的代码编写
1.ajax发送请求(建议使用jQuery):
$.ajax({
method:post;
url: "你要发送到后台去的地址",
parameter:你要传送的数据,
beforeSend:function(){在发送请求之前你要做的事}
afterSend:function(){在发送请求后你想做的事}
success:function(){alert('成功了!')}
});
2.后台处理JSON数据:
1)最基本的原理性解决办法:JSON不过是通过request对象传过来的键值对而已,直接获得request对象,去对应的属性就行了。
2)net.sf.json.JSONObject这个包你可以学习下,也不是很难。
3.关于返回页面:
你要控制页面跳转么?那你使用AJAX干毛啊?使用AJAX就是为了不刷新页面而把值传到后台去的。
如何使用ajax将json传入后台数据
首先采用jquery内部封装好的方法是比较简单的,我们只需做的就是修改里面的一些配置:
以下代码是对$.ajax()的解析:
$.ajax({
type: "POST", //提交方式
contentType: "application/json; charset=utf-8", //内容类型
dataType: "json", //类型
url: "前台地址/后台方法", //提交的页面,方法名
data: "parameter", //参数,如果没有,可以为null
success: function (data) { //如果执行成功,那么执行此方法
alert(data.d); //用data.d来获取后台传过来的json语句,或者是单纯的语句
},
error: function (err) { //如果执行不成功,那么执行此方法
alert("err:" + err);
}
});
当然我初次学习的时候,看到这些也是有些茫然的,因为不知道到如何才能将其用到自己的程序里面,所以就写了一个小的检测网页来测试一下,如果你测试的时候没有达到你想要的结果,那么希望你回头看一下,前台是否写的有问题,或者是参考一下下文中的注意事项吧。
前台代码 :
%@ Page Language="C#" AutoEventWireup="true" CodeBehind="number3.aspx.cs" Inherits="ajax1.number3" %
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head runat="server"
title测试ajax/title
script src="js/jquery-1.4.1.js" type="text/javascript"/script
script type="text/javascript" language="javascript"
function testAjax() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
url: "number3.aspx/GetJson",//传入后台的地址/方法
data: "{'RID':'123'}",//参数,这里是一个json语句
success: function (data) {
var result = data.d;
alert(result);
},
error: function (err) {
alert("err:" + err);
}
});
}
/script
/head
body
form id="form1" runat="server"
div
button 用button测试ajax/button
input type="button" value="testAjax" /
/div
/form
/body
/html
后台代码:
using System;
using System.Web.Services;
namespace ajax1
{
public partial class number3 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
[WebMethod]
public static string GetJson(string RID)
{
return "{'ID':'" + RID + "'}";
}
}
}
后台代码中以黄色为背景的就是我们要注意的地方:
1.using System.Web.Services;对应下面的[WebMethod]这个一定要加上的。
2.后台写的方法一定是公共静态的即一定是public static开头的。
3.参数一定是前台的data所传参数的键
前台中要注意的地方:
1.大家应该会注意到,前台我用的是两个button来测试,但是第一个button是不行的,页面会刷新一下,其实这都是form
id="form1"
runat="server"这行代码的问题,button标签会提交本页面的内容,从而导致异步刷新失败。所以建议大家不要用button标签。但是如果不得不用的话,解决办法还是有的,目前我知道的只有两个:
①:将form id="form1"
runat="server"代码去掉,当然如果本页面有要提交的内容就会很麻烦了
②:将button onclick="aaa();return
false;"用button测试ajax/button代码改为:button
onclick="aaa();return false;"用button测试ajax/button
2。前台的测试结果是:
那么我们如何来只获取json后面的值,而不是整个json语句呢,我们可以将json语句对象化,然后根据键来取得对应的值:前台的testAjax()的方法改为:
function testAjax() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
url: "number3.aspx/GetJson",
data: "{'RID':'123'}",
success: function (data) {
var result = eval("(" + data.d + ")");//这句话是将json语句对象化
alert(result.ID);
},
error: function (err) {
alert("err:" + err);
}
});
}
此时结果为:
以上就是初步学习json当时遇到的问题所留下的经验。同时我想验证一下是否能够在后台重载方法来实现根据前台的data是否有参数来判断要执行的方法,所以我将代码改动了一下:
改动后的前台代码
%@ Page Language="C#" AutoEventWireup="true" CodeBehind="number3.aspx.cs" Inherits="ajax1.number3" %
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head runat="server"
title测试ajax/title
script src="js/jquery-1.4.1.js" type="text/javascript"/script
script type="text/javascript" language="javascript"
function testAjax() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
url: "number3.aspx/GetJson",
data: "{'RID':'123'}",
success: function (data) {
var result = eval("(" + data.d + ")");
alert(result.ID);
},
error: function (err) {
alert("err:" + err);
}
});
}
function aaa() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
url: "number3.aspx/GetJson",
success: function (data) {
alert(data.d);
},
error: function (err) {
alert("err:" + err);
}
});
}
/script
/head
body
form id="form1" runat="server"
div
button 用button测试ajax/button
input type="button" value="testAjax" /
input type="button" value="aaa" /
/div
/form
/body
/html
改动后的后台代码
using System;
using System.Web.Services;
namespace ajax1
{
public partial class number3 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
[WebMethod]
public static string GetJson()
{
return "hello ajax";
}
[WebMethod]
public static string GetJson(string RID)
{
return "{'ID':'" + RID + "'}";
}
}
}
所得的效果为:
第一个和第二个按钮点击后效果为:
第三个按钮点击后效果为:
所以我的初步结论为:后台的重构函数是不成功的,如果有的重构参数的话,只会执行带参数的,而不会执行那个不带参数的。现在还不是太明白为什么会这样,所以希望明白原理的分享一下自己的观点。当然这只是个人观点,如若有误,望请指正。