快崩溃了!extjs的grid动态列的问题

Paradin 2010-09-07 05:30:04
最近在做一个extjs+SSH的项目,有个需求要用到grid动态生成列。
其中action中方法代码如下:
public String getPoqutityGridByPoId(){
PoqutityGridForm pf = purchaseOrderService.getPoqutityByPoIdgrid(detailPoId);
if(pf==null){
this.setJsonString("{result:[],totalRecord:0}");
return "fail";
}
List columnList = pf.getColNames();
List dataList = pf.getColValues();
JSONArray column = JSONArray.fromObject(columnList);
JSONArray data = JSONArray.fromObject(dataList);
String message ="{column:" +column.toString()+", data:"+data.toString()+"}";
this.setMessage(message);
this.setJsonString("{success:true, msg:'"
+ this.getMessage().toString() + "'}");
return this.SUCCESS;
}
在js中这样获得数据:
var cm;
var ds;
Ext.ajax.request({
url:'getPoqutityGridByPoId.do?detailPoId='+poId,
method:'post',
success:
function(response,options){
alert(response.responseText);
var json = Ext.util.JSON.decode(response.responseText);
var realjson = Ext.util.JSON.decode(json.msg);
cm = new Ext.grid.ColumnModel(realjson.column);
ds = new Ext.data.JsonStore({
data:realjson.data,
fields:['color','col1','col2','col3','col4','col5','col6','col7','col8','col9','col10','total']
});
},
failure:
function (){
}
});
后面生成grid
var podetailgrid = new Ext.grid.GridPanel({
title:"",
cm:cm,
ds:ds,
viewConfig: {
forceFit:true
},
frame:true,
collapsible: true,
animCollapse: false,
iconCls: 'icon-grid'
});

最后显示grid
var pnl = new Ext.Viewport({
layout: 'border',
items: [
{
region : 'north',
autoScroll : true,
border:false,
height: 720,
items: basePanel
},
{
region : 'center',
autoScroll : true,
border:false,
layout: 'fit',
items: podetailgrid
},
{
region : 'south',
autoScroll : true,
border:false,
height: 300,
minSize: 300,
maxSize: 600,
items: grid
}
]
});
在获取数据阶段我alert过,数据是有的,但是在生成grid的时候报出q is undefined的错误,请问到底应该怎么做啊?尝试了网上的好几个方法,快崩溃啦,求大侠们帮忙想想办法~~
...全文
799 16 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
16 条回复
切换为时间正序
请发表友善的回复…
发表回复
Paradin 2010-09-08
  • 打赏
  • 举报
回复
哦,你给的那个链接我没看仔细,漏了下载的文件,hoojo不好意思啊~还是谢谢啦~
Paradin 2010-09-08
  • 打赏
  • 举报
回复
[Quote=引用 14 楼 ibm_hoojo 的回复:]

引用 13 楼 paradin 的回复:

引用 12 楼 zoujp_xyz 的回复:

JScript code

var cm;
var ds;
Ext.ajax.request({
url: 'getPoqutityGridByPoId.do?detailPoId=' + poId,
method: 'post',
success: function(respons……
[/Quote]

可是我用同步的时候还是会q is undefined啊?只有放在request里面的才成功了。同步的我是这样写的,是不是写法还是不对?:
Ext.Ajax.request({
url:'getPoqutityGridByPoId.do?detailPoId='+poId,
method:'post',
async:false,
success:
function(response,options){
alert(response.responseText);
var json = Ext.util.JSON.decode(response.responseText);
var realjson = Ext.util.JSON.decode(json.msg);
cm = new Ext.grid.ColumnModel(realjson.column);
ds = new Ext.data.JsonStore({
data:realjson.data,
fields:['color','col1','col2','col3','col4','col5','col6','col7','col8','col9','col10','total']
});
},
failure:
function (){
//results="";
}
});
var podetailgrid = new Ext.grid.GridPanel({
title:"",
cm:cm,
ds:ds,
viewConfig: {
forceFit:true
},
frame:true,
collapsible: true,
animCollapse: false,
iconCls: 'icon-grid'
});

var pnl = new Ext.Viewport({
layout: 'border',
items: [
{
region : 'north',
autoScroll : true,
border:false,
height: 720,
items: basePanel
},
{
region : 'center',
autoScroll : true,
border:false,
layout: 'fit',
items: podetailgrid
},
{
region : 'south',
autoScroll : true,
border:false,
height: 300,
minSize: 300,
maxSize: 600,
items: historygrid
}
]
});


hoojo 2010-09-08
  • 打赏
  • 举报
回复
[Quote=引用 13 楼 paradin 的回复:]

引用 12 楼 zoujp_xyz 的回复:

JScript code

var cm;
var ds;
Ext.ajax.request({
url: 'getPoqutityGridByPoId.do?detailPoId=' + poId,
method: 'post',
success: function(response, options) {
alert(res……
[/Quote]

是的,因为异步的时候数据没有获取,才导致错误的。如果用同步就不用改了
也可以用setTimeout延时获取
用异步放在回调函数中即可

设置同步参考7#
Paradin 2010-09-08
  • 打赏
  • 举报
回复
[Quote=引用 12 楼 zoujp_xyz 的回复:]

JScript code

var cm;
var ds;
Ext.ajax.request({
url: 'getPoqutityGridByPoId.do?detailPoId=' + poId,
method: 'post',
success: function(response, options) {
alert(response.respons……
[/Quote]

按照你的说法,真的解决了,太感谢啦,我想问一下,为什么这个地方要把viewport放在ajax.request里面才可以呢?按理来说,我把request设成同步的话viewport放在后面不也可以获得数据了吗?
zoujp_xyz 2010-09-08
  • 打赏
  • 举报
回复

var cm;
var ds;
Ext.ajax.request({
url: 'getPoqutityGridByPoId.do?detailPoId=' + poId,
method: 'post',
success: function(response, options) {
alert(response.responseText);
var json = Ext.util.JSON.decode(response.responseText);
var realjson = Ext.util.JSON.decode(json.msg);
cm = new Ext.grid.ColumnModel(realjson.column);
ds = new Ext.data.JsonStore({
data: realjson.data,
fields: ['color', 'col1', 'col2', 'col3', 'col4', 'col5', 'col6', 'col7', 'col8', 'col9', 'col10', 'total']
});
//将grid写在这里,有关异步的操作
var podetailgrid = new Ext.grid.GridPanel({
title: "",
cm: cm,
ds: ds,
viewConfig: {
forceFit: true
},
frame: true,
collapsible: true,
animCollapse: false,
iconCls: 'icon-grid'
});

最后显示grid
var pnl = new Ext.Viewport({
layout: 'border',
items: [{
region: 'north',
autoScroll: true,
border: false,
height: 720,
items: basePanel
},
{
region: 'center',
autoScroll: true,
border: false,
layout: 'fit',
items: podetailgrid
},
{
region: 'south',
autoScroll: true,
border: false,
height: 300,
minSize: 300,
maxSize: 600,
items: grid
}]
});
},
failure: function() {}
});
tqq323 2010-09-08
  • 打赏
  • 举报
回复
[Quote=引用 8 楼 asdujiayong 的回复:]

引用 6 楼 paradin 的回复:
要改成同步该怎么改啊?

JScript code
可以把生成grid放在ajax请求的回调方法success中,
这样能保证请求的数据已经返回
试下看.
[/Quote]

试过放在回调方法success中生成grid
但是这样在这个方法外就不能用到grid了,怎么把这个grid布局到viewport中?
Paradin 2010-09-08
  • 打赏
  • 举报
回复
[Quote=引用 9 楼 aj3423 的回复:]

动态列生成 不需要人工发ajax 再生成列,这样会造成要等request返回才能生成界面, 好的做法是先生成grid, 然后load时候动态生成列
参考API上 JsonReader,开头有个metaData的例子,就是用来动态生成列的
API上漏了一个最重要的属性
JScript code
{
metaData: {
"idProperty": "id",
……
[/Quote]
这个没有看的太明白~能不能修改下1L的代码解释下?
aj3423 2010-09-08
  • 打赏
  • 举报
回复
动态列生成 不需要人工发ajax 再生成列,这样会造成要等request返回才能生成界面, 好的做法是先生成grid, 然后load时候动态生成列
参考API上 JsonReader,开头有个metaData的例子,就是用来动态生成列的
API上漏了一个最重要的属性
{
metaData: {
"idProperty": "id",
"root": "rows",
"totalProperty": "results"
"successProperty": "success",
colModel:[{dataIndex:'col1', header: 'Column 1'}, ...], // API漏了这个
"fields": [
{"name": "name"},
{"name": "job", "mapping": "occupation"}
],
asdujiayong 2010-09-08
  • 打赏
  • 举报
回复
[Quote=引用 6 楼 paradin 的回复:]
要改成同步该怎么改啊?
[/Quote]
可以把生成grid放在ajax请求的回调方法success中,
这样能保证请求的数据已经返回
试下看.
hoojo 2010-09-08
  • 打赏
  • 举报
回复
[Quote=引用 6 楼 paradin 的回复:]

要改成同步该怎么改啊?
[/Quote]

2种方法
1、下载官方提供的ext-basex.js里面封装了Ext.Ajax.request的同步参数设置
参考:http://www.cnblogs.com/fengmiaosen/archive/2010/06/23/1763484.html

2、直接用ext-base.js中的方法,但是需要重写
具体参考:URL很长
Paradin 2010-09-07
  • 打赏
  • 举报
回复
要改成同步该怎么改啊?
Paradin 2010-09-07
  • 打赏
  • 举报
回复
这个地方我alert过,确实是object,但是后面还是会报q is undefined的错误啊?
hoojo 2010-09-07
  • 打赏
  • 举报
回复
[Quote=引用楼主 paradin 的回复:]
最近在做一个extjs+SSH的项目,有个需求要用到grid动态生成列。
其中action中方法代码如下:
public String getPoqutityGridByPoId(){
PoqutityGridForm pf = purchaseOrderService.getPoqutityByPoIdgrid(detailPoId);
if(pf==null){
this.setJs……
[/Quote]

可能是异步的问题,异步加载数据的时候。后面的代码不会等待签名的ajax执行完了才执行的。
你将异步设为同步看看
success:
function(response,options){
alert(response.responseText);
var json = Ext.util.JSON.decode(response.responseText);
var realjson = Ext.util.JSON.decode(json.msg);//确定这里的object中可以拿到column并且是一个object就没有问题了
cm = new Ext.grid.ColumnModel(realjson.column);
ds = new Ext.data.JsonStore({
data:realjson.data,
fields:['color','col1','col2','col3','col4','col5','col6','col7','col8','col9','col10','total']
});
},
Paradin 2010-09-07
  • 打赏
  • 举报
回复
嗯,是这个顺序,我也觉得可能是这个问题,但是我怎么样才能解决这个问题呢?我有点迷茫~~~
lzybtxning 2010-09-07
  • 打赏
  • 举报
回复
你这些代码顺序就是这样的吗?
有可能会是你用ajax请求了数据,但是ajax请求还没返回的时候,底下的代码已经执行了,那肯定不对了
Paradin 2010-09-07
  • 打赏
  • 举报
回复
自己顶起~~抓狂中~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

87,997

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

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