ExtJS怎么把后读取的JSON数据添加到先生成的GridPanel的Store中?

okiwill 2014-05-06 12:31:35
我用gridpanel做了一份需要用户填写的表,因此一开始呈现给用户时是空的(没有空行,用户点击增加行然后输入数据);
但是为了用户方便,下次填表时不重复填写相同的信息,增加了一个按钮,读取上一次填报的数据。
我是这么写的:
先定义model

Ext.define('Boss', {
extend: 'Ext.data.Model',
fields: [{
name: 'id',
type: 'string'
}, {
name: 'name',
type: 'string'
}]
});

然后是store:

//空数据赋给store
var data = {};
// 创建gridpanel的store
var store = Ext.create('Ext.data.Store', {
autoDestroy: true,
model: 'Boss',
data: data,
sorters: [{
property: 'id',
direction: 'ASC'
}]
});

最后是gridpanel:

//创建gridpanel
var grid = Ext.create('Ext.grid.Panel', {
id: "_Boss",
store: store,
columns: [{
header: '姓名',
dataIndex: 'name',
editor: {
allowBlank: false,
blankText: '姓名不得为空'
}
}],
renderTo: 'Boss'
});

为简便我略去了gridanel里面的plugins: [rowEditing]等等代码。
我现在用Ext.Ajax读取并返回了上一次的json数据,怎么呈现给用户呢……找不到相应的方法……求大神点拨Orz
...全文
1105 8 打赏 收藏 转发到动态 举报
写回复
用AI写文章
8 条回复
切换为时间正序
请发表友善的回复…
发表回复
hardbull 2014-05-12
  • 打赏
  • 举报
回复
大家好,请教一个问题: 在一个固定的的页面元素上用onmouseover和onmouseout,没问题。 但如果是动态页面,并且连元素的id都是动态生成的(如从数据库中提取数据并分页显示,页数就是不固定的,用于点击选择的页码元素是动态生成的),请问在元素id不固定情况下,应该如何利用此两个事件(onmouseover和onmouseout)呢?
okiwill 2014-05-09
  • 打赏
  • 举报
回复
引用 1 楼 bdmh 的回复:

 	 var flowstore = Ext.create('Ext.data.Store',{
 	 	model:Flow_Model,
 	 	proxy:{
 	 		type:'ajax',
			url:'xxxxxxxxx',//后台取数据的地址
 	 		reader:{
 	 			type:'json',
 	 			root:'items',
 	 			idProperty:'flowcode',
 	 			messageProperty:'msg'
 	 		}
 	 	}
 	 });
如果store的autload为false的话,要手动load,比如 xxstore.load()
谢谢版主哈。。这种方法就是新建一个store吧……type那里写memory就是用现有的json了吧?把这个新的store绑定到gridpanel怎么写呢?我查了几种都没效果。。不知道哪里不对
okiwill 2014-05-09
  • 打赏
  • 举报
回复
引用 2 楼 yys79 的回复:
有点意思的问题,意思是rowEditing时候加载最后那条数据的值吧?
嗯?你说的这个确实有点意思。。。。不过我暂时还用不到绑定到RowEditing,就是点击按钮然后加载旧数据。 我现在有点混乱的就是不知道选哪个: 1、新建store然后重新绑定给gridpanel? 2、把json写入到原有的空store中,然后refresh?
bdmh 2014-05-09
  • 打赏
  • 举报
回复
java后台组织数据

	private class S_Data{
		private String code;
		private String fileext;
		private String describe;
	}

	private String getSealData() {
		// TODO Auto-generated method stub
		ResultSet rs=null;
		PreparedStatement pst = null;
		try {		
			String sqlstr = "select code,describe,fileext from bas_seal";	
			pst = DB.getDBServiceInstance().getConnection().prepareStatement(sqlstr);	
			rs = pst.executeQuery();	
		} catch (SQLException e) {
		}		
		Gson gson = new Gson();
		List<S_Data> list = new ArrayList<S_Data>();
		try
		{			
			while(rs.next())
			{
				S_Data data = new S_Data();
				data.code = rs.getString("code");
				data.fileext = rs.getString("fileext");
				data.describe = rs.getString("describe");
				list.add(data);
			}
			rs.close();
			pst.close();
		}
		catch(SQLException e)
		{
			
		}
		return "{success:true,items:"+gson.toJson(list)+"}";
	}
bdmh 2014-05-09
  • 打赏
  • 举报
回复
在需要时,调用 loadSealStore加载数据即可

 /**
  * 定义模型
  */
	Ext.define('S_Model',{
	 	extend:'Ext.data.Model',
	 	fields:[{
	 		name:'code',
	 		type:'string'
	 	},{
	 		name:'fileext',
	 		type:'string'
	 	},{
	 		name:'describe',
	 		type:'string'
	 	}]
	 }); 
/**
 * 签章Store
 */
	var sealStore = Ext.create('Ext.data.Store',{
 	 	model:S_Model,
 	 	proxy:{
 	 		type:'ajax',
 	 		api:{
					read:'././SealAndSignatureServlet?key='+SEAL
				},
 	 		reader:{
 	 			type:'json',
 	 			root:'items',
 	 			idProperty:'code',
 	 			messageProperty:'msg'
 	 		}
 	 	},
 	 	listeners:{
 	 		load:function(store){

 	 		}
 	 	}
 	 });
 /**
  * 签章表格的列
  * @type 
  */
 	var gridSealCols = {
 	 	defaults:{
 	 		sortable:false,
 	 		menuDisabled:true
 	 	},
 	 	items:[{
	 	 	text:'编号',
	 	 	dataIndex:'code',
	 	 	width:70
	 	 },{
	 	 	text:'描述',
	 	 	dataIndex:'describe',
	 	 	flex:1
	 	 }]
 	 }; 
 /**
 * 签章表格
 */
 	var gridSeal = Ext.create('Ext.grid.Panel',{
 		region:'center',
 		store:sealStore,
 		columns:gridSealCols
 	});
 /**
  * 加载签章数据
  */
 	function loadSealStore()
 	{
 		sealStore.load({
 			params:{
 				key:FLOW
 			}
 		});
 	}
loveunittesting 2014-05-09
  • 打赏
  • 举报
回复
lz是获得数据后,没法找到编辑控件(比如文本框)去填充吗?
loveunittesting 2014-05-06
  • 打赏
  • 举报
回复
有点意思的问题,意思是rowEditing时候加载最后那条数据的值吧?
bdmh 2014-05-06
  • 打赏
  • 举报
回复

 	 var flowstore = Ext.create('Ext.data.Store',{
 	 	model:Flow_Model,
 	 	proxy:{
 	 		type:'ajax',
			url:'xxxxxxxxx',//后台取数据的地址
 	 		reader:{
 	 			type:'json',
 	 			root:'items',
 	 			idProperty:'flowcode',
 	 			messageProperty:'msg'
 	 		}
 	 	}
 	 });
如果store的autload为false的话,要手动load,比如 xxstore.load()

87,904

社区成员

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

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