json无法显示数据，JSP页面输出没问题

许可均 2013-10-24 12:22:05
JS
function showUrl(value){
return "<a href=http://"+value+" target='_blank'>"+value+"</a>";
}

function formatAge(value,metadata){
if(value > 30) {
metadata.attr = 'style="color:red"';
}
return value;
}

function formateID(value,metadata){
if(value % 2 == 0) {
metadata.attr = 'style="background-color:red"';
}
return value;
}


Ext.onReady(function(){

//记录类型
var Person = new Ext.data.Record.create([
{name:"id",mapping:"id"},
{name:"name",mapping:"name"},
{name:"age",mapping:"age"},
{name:"homePage",mapping:"homePage"}
]);

//存储器
var store = new Ext.data.Store({
url:"JsonServle.jsp",
reader:new Ext.data.JsonReader(
{id:"id"},
Person)
});

store.load();
var sm = new Ext.grid.CheckboxSelectionModel();

//表格面板
var gridPanel = new Ext.grid.GridPanel({
id:"gridPanel",
renderTo:"xu",
title:"人员信息",
width:500,
height:300,
store:store,
columns:[
sm,
{header:"id",dataIndex:"id",sortable:true,renderer:formateID},
{header:"姓名",dataIndex:"name",sortable:true},
{header:"年龄",dataIndex:"age",sortable:true,renderer:formatAge},
{header:"个人主页",dataIndex:"homePage",sortable:true,renderer:showUrl}
],
autoExpandColumn:4,
sm:sm,
bbar:[
{text:"获得所选行",handler:function(){
var msg = "";
var row = gridPanel.getSelectionModel().each(function(rec){
msg = msg + rec.get("id") + "," + rec.get("name") + "," +
rec.get("age") + "," + rec.get("homePage") + "\n";
});
alert(msg);
}}
]
})
});
JSP
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page import="xu.json.*"%>
<%@ page import="net.sf.json.JSONArray"%>
<%
List<Person>persons = new ArrayList<Person>();
Person person = new Person(1,"张三",20,"www.baid");
Person person2 = new Person(2,"张四",25,"www.baid");
persons.add(person);
persons.add(person2);


JSONArray jsonObject = JSONArray.fromObject(persons);
response.getWriter().write(jsonObject.toString());
%>
<html>
</html>
有布局 就是没显示JSON数据
...全文
406 16 打赏 收藏 转发到动态 举报
写回复
用AI写文章
16 条回复
切换为时间正序
请发表友善的回复…
发表回复
wyx100 2013-10-27
  • 打赏
  • 举报
 回复
传过来的数据为Json字符串，在使用时需要转回成数组或对象Json.parse，再使用。(没细看你的代码,自己可以用firebug或是alert调一下看下。)
宁波朱超 2013-10-25
  • 打赏
  • 举报
 回复
打断点 调试 亲。
StriveYung 2013-10-25
  • 打赏
  • 举报
 回复
你这老火啊 是不是啊
司机 2013-10-25
  • 打赏
  • 举报
 回复
引用 8 楼 u010016988 的回复: 主要看你传递到页面的时候有没有数据 数据格式是什么 报错不报错··大概就是个这 [{"age":20,"homePage":"www.baid","id":1,"name":"张三"},{"age":25,"homePage":"www.baid","id":2,"name":"张四"}] JSP输出是这样的 说明传过来的数据为Json字符串，在使用时需要转回成数组或对象Json.parse，再使用。(没细看你的代码,自己可以用firebug或是alert调一下看下。)
夏凉风 2013-10-25
  • 打赏
  • 举报
 回复
亲，你的Ext写的好乱！有点问题！我给你看看我的GridPanel 

 var ds_recordfile = new Ext.data.Store({
			autoLoad : true,
			autoSave : false,
			pruneModifiedRecords : false,
			baseParams : {
				limit : page
			},
			proxy : new Ext.data.HttpProxy({
						url : './getRecListChnl.action'
					}),
			reader : new Ext.data.JsonReader({
						root : 'root',
						totalProperty : 'totalCount'
					}, [{
								name : 'id'
							}, {
								name : 'filenickname'
							}, {
								name : 'roomname'
							}, {
								name : 'channelname'
							}, {
								name : 'recusername'
							}, {
								name : 'filestatus'
							}, {
								name : 'starttime'
							}, {
								name : 'endtime'
							}, {
								name : 'desc'
							}, {
								name : 'opt'
							}, {
								name : 'serverip'
							}, {
								name : 'fileaddr'
							}, {
								name : 'port'
							}, {
								name : 'storageaddr'
							}, {
								name : 'folderid'
							}, {
								name : 'plays'
							}])
}）;
grid_recordfile = new Ext.grid.GridPanel({
			id : 'recordfile_panel',
			height:h,
			el:'grid',
			width:window.screen.availWidth*0.27,
			loadMask : {
				msg : '正在加载数据，请稍侯……'
			},
			stripeRows : true,// 显示斑马线
			cm : new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(), {
						id : 'id',
						header : "录像id",
						width : 50,
						sortable : true,
						dataIndex : 'id',
						hidden : true
					}, {
						id : 'filenickname',
						header : "录像文件名",
						width : 100,
						sortable : true,
						dataIndex : 'filenickname',
						hidden : true
					}, {
						id : 'starttime',
						header : "开始时间",
						width : 150,
						sortable : true,
						dataIndex : 'starttime',
						renderer : function(value, cellmeta, record, rowIndex,
								columnIndex, store) {
							if (value != null
									&& value.replace(/(^\s*)(\s*$)/g, '') != '') {
								return value.substring(0, value.length - 2);
							} else {
								return value;
							}
						}
					}, {
						id : 'endtime',
						header : "结束时间",
						width : 150,
						sortable : true,
						dataIndex : 'endtime',
						renderer : function(value, cellmeta, record, rowIndex,
								columnIndex, store) {
							if (value != null
									&& value.replace(/(^\s*)(\s*$)/g, '') != '') {
								return value.substring(0, value.length - 2);
							} else {
								return value;
							}
						}
					}, {
						id : 'channelname',
						header : "通道名称",
						width :150,
						sortable : true,
						dataIndex : 'channelname'
					}, {
						id : 'opt',
						header : "操作",
						width : 100,
						sortable : true,
						dataIndex : 'opt',
						renderer : function operating(value, cellmeta, record,
								rowIndex, columnIndex, store) {
							type = record.get('fileaddr').indexOf('.tpc') == -1
									? 'xms://'
									: 'avms://';
							var demand = "<a href=# onclick = Play('"+
									type+ record.get('serverip')
									+ "/"
									+ record.get('fileaddr')
									+ "');return false;><img src = 'images/avvod_icons/play.png'></a>　";
						var download = "<a href=# onclick = download('"
							+ record.get('serverip')
							+ "','"
							+ record.get('port')
							+ "','"
							+ record.get('fileaddr')
							+ "','"
							+ record.get('storageaddr')
							+ "','download');return false;><img src = 'images/avvod_icons/dowload.png'></a>　";
									return demand+download;
																	
						}
						
					},{
						id : 'fileaddr',
						header : "文件路径",
						width : 100,
						sortable : true,
						dataIndex : 'fileaddr',
						hidden : true
					}, {
						id : 'folderid',
						header : "所属文件夹",
						width : 50,
						sortable : true,
						dataIndex : 'folderid',
						hidden : true
					}]),
			store : ds_recordfile,
			bbar : new Ext.PagingToolbar({
						pageSize : page,
						store : ds_recordfile,
						displayInfo : true,
						afterPageText : '/ {0}',
						beforePageText : '页',
						firstText : "第一页",
						prevText : "上一页",// update
						nextText : "下一页",
						lastText : "最后页",
						refreshText : "刷新",
						displayMsg : '显示第 <em>{0}</em> 条到 <em>{1}</em> 条记录，一共 <em>{2}</em> 条',
						emptyMsg : "没有记录"
					}),
			load : ds_recordfile
});
grid_recordfile.render();
JSON数据格式：包括分页 {"totalCount":5,"root":[{"port":"8080","endtime":"2013-08-29 16:58:34.0","storageaddr":"/opt/avcon/hprec/recfile/"}]}
tony4geek 2013-10-24
  • 打赏
  • 举报
 回复
var myReader = new Ext.data.JsonReader({ totalProperty: "results", root: "rows", id: "id" }, MyRecord);
许可均 2013-10-24
  • 打赏
  • 举报
 回复
引用 8 楼 u010016988 的回复:
主要看你传递到页面的时候有没有数据 数据格式是什么 报错不报错··大概就是个这
[{"age":20,"homePage":"www.baid","id":1,"name":"张三"},{"age":25,"homePage":"www.baid","id":2,"name":"张四"}] JSP输出是这样的
u010016988 2013-10-24
  • 打赏
  • 举报
 回复
主要看你传递到页面的时候有没有数据 数据格式是什么 报错不报错··大概就是个这
u010016988 2013-10-24
  • 打赏
  • 举报
 回复
``囧 js脚本 就是看看你传递回来的值神森马···亲 别玩我啊 你会json jquery js 不知道alert···
许可均 2013-10-24
  • 打赏
  • 举报
 回复
引用 4 楼 u010016988 的回复:
贴个数据呗 alert弹出来看下是什么
alert什么呢
许可均 2013-10-24
  • 打赏
  • 举报
 回复
要沉了吗？？
u010016988 2013-10-24
  • 打赏
  • 举报
 回复
贴个数据呗 alert弹出来看下是什么
许可均 2013-10-24
  • 打赏
  • 举报
 回复
引用 1 楼 u010016988 的回复:
JSONArray我记得好像是类和类之间传递· 是不是应该转换成JSONObject JSONObject jsonObject; public String json() throws IOException { goods= gooddao.findAll(); String json ="{'total':100,'rows':[" ; for (int i = 0; i < goods.size(); i++) { WzGoods goo = goods.get(i); json += "{'code':'"+goo.getGoodCode()+"',"; json += "'name':'"+goo.getGoodFname()+"',"; if(i+1==goods.size()) json += "'measure':'"+goo.getGoodMeasure()+"'}"; else json += "'measure':'"+goo.getGoodMeasure()+"'},"; } json +="]}"; try { jsonObject = jsonObject.fromObject(json); // jsonResult= JSONArray.fromObject(json).toString(); System.out.println(json); } catch (Exception e) { // TODO: handle exception e.printStackTrace(); } return SUCCESS; } $('#tt').datagrid({ title:'展示数据', width:560, height:250, url:'wzjson', fitColumns: true, columns:[[ {field:'code',title:'编号',width:80,sortable:true}, {field:'name',title:'名字',width:80,sortable:true}, {field:'measure',title:'单位',width:80,sortable:true}]] , pagination:true,rownumbers:true }); } 我是这么绑定的
我的是数组输出的，所以要JSONArray 输出
许可均 2013-10-24
  • 打赏
  • 举报
 回复
求高手指出错误
许可均 2013-10-24
  • 打赏
  • 举报
 回复
求解~~~~~
u010016988 2013-10-24
  • 打赏
  • 举报
 回复
JSONArray我记得好像是类和类之间传递· 是不是应该转换成JSONObject JSONObject jsonObject; public String json() throws IOException { goods= gooddao.findAll(); String json ="{'total':100,'rows':[" ; for (int i = 0; i < goods.size(); i++) { WzGoods goo = goods.get(i); json += "{'code':'"+goo.getGoodCode()+"',"; json += "'name':'"+goo.getGoodFname()+"',"; if(i+1==goods.size()) json += "'measure':'"+goo.getGoodMeasure()+"'}"; else json += "'measure':'"+goo.getGoodMeasure()+"'},"; } json +="]}"; try { jsonObject = jsonObject.fromObject(json); // jsonResult= JSONArray.fromObject(json).toString(); System.out.println(json); } catch (Exception e) { // TODO: handle exception e.printStackTrace(); } return SUCCESS; } $('#tt').datagrid({ title:'展示数据', width:560, height:250, url:'wzjson', fitColumns: true, columns:[[ {field:'code',title:'编号',width:80,sortable:true}, {field:'name',title:'名字',width:80,sortable:true}, {field:'measure',title:'单位',width:80,sortable:true}]] , pagination:true,rownumbers:true }); } 我是这么绑定的
后台返回json数据给前台和前台解析json数据（总结）
后台返回json数据和前台解析json数据 一般来说web开发中，前台采用json数据提交给后台，后台处理数据以后返回json数据给前台，前台解析json，显示数据。 总而言之，前后台直接交换的数据格式最常用的非json数据无疑了。 这里就总结一些json数据的前后台处理方式。 1.JSON数据 JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据...
IDEA中后台能够检测到数据但是前台Jsp页面接收不到值
后台数据可以检测到但是在传入到前台jsp也面时不会显示出现这样的原因是 web.xml的版本号过低IDEA2021的默认生成的就会出现这种问题将其更换头目录后刷新。 低版本 <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd" > 更换后 <?xml version="1.0" encod
JSP基础语法及使用
JSP实际上就是一个Servlet。jsp文件第一次访问的时候是比较慢的，为什么？JSP是什么？JSP既然本质上是一个Servlet，那么JSP和Servlet到底有什么区别呢？JSP的基础语法在jsp文件中直接编写文字，都会自动被翻译到哪里？JSP的page指令，解决响应时的中文乱码问题：怎么在JSP中编写Java程序：JSP的输出语句在JSP中如何编写JSP的专业注释JSP基础语法总结：使用Servlet + JSP完成oa项目的改造。Servlet中连接数据库，查询所有的部门，遍历结果集。在JSP..
玩转SpringMVC之响应Json数据（关键注解@ResponseBody）
本文承接上文《玩转SpringMVC之响应视图方法类型案例以及使用注意点》访问链接为：https://blog.csdn.net/xtho62/article/details/109111712 文章目录ResponseBody 响应JSON数据AJAX请求测试 ResponseBody 响应JSON数据 JSON简介： JSON：JavaScript 对象表示法（JavaScript Object Notation）。 JSON 是存储和交换文本信息的语法。类似 XML。 JSON 比 XML 更小、更
JSON数据
JSON数据格式的转化
Web 开发

81,094

社区成员

341,711

社区内容

发帖
与我相关
我的任务
社区描述
Java Web 开发
社区管理员
  • Web 开发社区
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章