怎么在ext里显示数据库存的图片?
var _jsonReader = new Ext.data.JsonReader({
root: 'root',
totalProperty: 'totalProperty',
fields:[{name : 'userId',mapping : 'userId'},
{name : 'photo',mapping : 'photo'}]
});
数据库里的image字段存的是图片的地址,怎么在extjs里显示出来呢?
我试着用
{
xtype: 'box',
width: 150,
height: 150,
autoEl: {
tag: 'img',
src: 'd:\photo.jpg'
}
}
这样可以显示本地的图片,我的意思是取数据库里存的路径来显示,不知道该怎么改...
在这里先谢谢大家了!
[b]问题补充：[/b]
是在一个FormPanel上作为一个item来显示
[b]问题补充：[/b]
form1 = new Ext.FormPanel( {
labelWidth : 55,
url : 'UnitUpdate.action',
frame : true,
title : '修改用户',
bodyStyle : 'padding:5px 5px 0',
width :400,
labelWidth:65,
waitMsgTarget : true,
reader : _jsonFormReader,
defaults : {
width : 400
},
defaultType : 'textfield',
items: [{
fieldLabel: '用户编码',
name: 'userId',
anchor:'90%'
}]
})
这样是可以取到userId的值,但好像image这样不能显示
[b]问题补充：[/b]
photo的值怎么放到{
xtype: 'box',
width: 150,
height: 150,
autoEl: {
tag: 'img',
src: 'd:\photo.jpg'
}
}
的src里面呢?
[b]问题补充：[/b]
createImage(src)这个src怎么从jsonReader里面取出来呢？
[b]问题补充：[/b]
[img]http://yxskkk.iteye.com/upload/picture/pic/38193/8bee3bc3-4408-3692-80a1-4d128f6a0138.jpg [/img]
{
id :'image',
width : 150,
height: 150,
xtype : 'textfield',
fieldLabel: '照片',
name: 'image',
inputType:'image'
}
不出图片呀,不知道哪里错了
[b]问题补充：[/b]
form.getForm().findField("photo").getEl().dom.src="图片路径";
我的意思是，这个src="图片路径",这个"图片路径"是怎么从jsonReader里面取出来的~
[b]问题补充：[/b]
_jsonReader.photo
_jsonReader["photo"]
_jsonReader.jsonData.photo
都是undefined
[b]问题补充：[/b]
数据是有的,在action里System.out.println可以打出来,其他数据都有显示
[b]问题补充：[/b]
alert打出来_jsonReader.jsonData是undefined
其实有个很简单的写法如下：
[code="java"]
{
id :'photo',
width : 200,
height: 200,
xtype : 'textfield',
fieldLabel: '照片',
name: 'photo',
inputType:'image'
}
[/code]
返回给FormPanel对象设置值即可
form.getForm().setValues(json);
如果你数据库里面存储的是绝对地址的话，如上就可以实现，如果是相对地址的话
你稍微改动下json对象即可：
json["photo"] = "path/"+json["photo"];
数据库读出来后,本地应用的话转为绝对或相对路径, 网络应用的话,自然是你的web服务器里面发布出来的网络路径....
[code="js"]function createImage(src) {
return {
xtype: 'box',
width: 150,
height: 150,
autoEl: {
tag: 'img',
src: src
}
}
}[/code]
看了下源码,存在FormPanel-Form-Action-result.data里面
ext-2.2.1\source\widgets\form\Action.js
// private
handleResponse : function(response){
if(this.form.reader){
var rs = this.form.reader.read(response);
var data = rs.records && rs.records[0] ? rs.records[0].data : null;
return {
success : rs.success,
data : data
};
}
return Ext.decode(response.responseText);
}
不好意思，我没说清楚。
正确的设置用法如下：
[code="java"]
form.getForm().findField("photo").getEl().dom.src="图片路径";
[/code]
首先你的jsonReader确保已经正确取得数据
然后有很多种方法获得数据，如下:
jsonReader["photo"];
jsonReader.photo;
jsonReader.jsonData.photo;//jsonReader对象是Ext.data.JsonReader使用方式
以上方法都可以取出你想要的数据
_jsonReader.jsonData就是json数据，你再自己根据这个数据构建items就ok了
用了reader : _jsonFormReader, 这个还真搞不出那个json数据了