ext從資料庫載入資料庫
Ⅰ ext怎麼從資料庫中取得圖片路徑,然後在js上顯示出圖片呢
首先從資料庫獲取信息到前端,接收數據要用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做前台該做的事