ext怎么从数据库中取得图片路径,然后在js上显示出图片呢?

 我来答
luffy1201
推荐于2018-04-17 · TA获得超过1523个赞
知道小有建树答主
回答量:401
采纳率:0%
帮助的人:576万
展开全部
首先从数据库获取信息到前端,接收数据要用store,你把图片的路径写入数据库中,然后通过store去load数据到前端。

然后要看你要怎么展示图片,在哪显示了!
例如使用Ext.XTemplate,自己去写图片显示的位置,样式等。可以去参考ext3.0文档中Ext.DataView的例子

var store = new Ext.data.JsonStore( {
fields : [ "id", "name", "path" ],
url: '....',
......
});
store.load();

var tpl = new Ext.XTemplate('<div class="aaa"><img src="{path}" title="{name}" /></div>',);
var dataview = new Ext.DataView( {
store: store,
tpl: tpl,
........
});

var panel = new Ext.Panel({
.......
items:dataview
)}

还可以使用textfield,这就要自己完成整个panel或window的布局了
例如:
.....
{
columnWidth : .5,
layout : 'form',
labelWidth : 60,
items : [{
xtype : 'textfield',
fieldLabel : '个人照片',
width : 150,
Height : 180,
inputType : 'image',

listeners : { // 该项被载入时加载照片
'render' : function(_filed) {
_filed.getEl().dom.src = "a.jpg";//这里图片的路径可以预先从store中读取,赋给变量然后给它
}
}
}]
}

如果是在grid里显示图片,那么grid中的ColumnModel里可以有一个字段是图片路径,然后通过store传入该路径并显示
例如:
var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(), sm,
{
header : "图片",
width : 40,
dataIndex : "path",
align : "center",
renderer : function(v) {
return "<img src='" + v +"'>"
}
},
......

还有很多跟图片有关的地方,我暂时也想不起来,看具体情况具体解决了,总之后台对应的是数据库,前台对应的是store,前后交互就是把后台的数据放store里,然后前台根据store做前台该做的事
轩轩尼诗bobo
2010-11-11 · TA获得超过6727个赞
知道大有可为答主
回答量:1373
采纳率:0%
帮助的人:1814万
展开全部
使用全局ID 唯一命名法是最有效果的,
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友3f8f0fe
2010-11-02 · 超过16用户采纳过TA的回答
知道答主
回答量:50
采纳率:0%
帮助的人:26.2万
展开全部
LoadData("remind!list.action",function(u){
...
{
xtype : 'displayfield',
html : '<img alt="image" src=u.picPath width="100" height="60">'
},{
xtype : 'box',
width : 14, // 图片宽度
height : 14, // 图片高度
autoEl : {
tag : 'img',
style : 'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);',
src : u.picpath // '/QMS/images/delete.jpg'
}}
...
}
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(1)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式