extjs实现选择多表自定义查询功能 前台部分(ext源码)
Ext.apply(Ext, {
isFirebug: (window.console && window.console.firebug)
});
Ext.ns('app');
app.getMetaGrid = function(config){
return new Ext.ux.grid.MetaGrid(Ext.apply({
baseParams: null,
/**
* @cfg {String} url Specify the url to the data object (server side
* script) from which to load data through the HttpProxy.
*/
url: 'http://www.jb51.net/AdvancedSearch/extSearchResultList.do?ssid='+globalQueryString("ssid"),
// url: 'meta-data.js',
renderChange: function(val){
if (val > 0) {
return '' + val + '';
} else if (val < 0) {
return '' + val + '';
}
return val;
},
renderCombo: function(val, metadata, record, rowIndex, colIndex, store){
var data;
/*
// the field name:
//var field = record.fields.items[colIndex].name; // unreliable since colIndex may be wrong
var field = this.colModel.getDataIndex(colIndex);
// Use the Store Manager to get a reference to the ComboBox store.
// The store that is passed as one of arguments to this renderer
// function is the grid store. We need to cross reference the data
// with the ComboBox store, not the grid store.
//Get a registered Store using the id of the Store
var storeId = field;
var comboStore = Ext.StoreMgr.lookup(storeId);
if (!comboStore) {
comboStore = new App.ComboStore(storeId);
}
var comboRecord = comboStore.getById(val);
if (comboRecord) {
data = comboRecord.data.displayField;
}
else {
data = data;//'missing data';
}
*/
// return the value that should be rendered into the grid cell
return data;
},
/**
* Date renderer function
* Renders a date
*/
renderDate: function(date){
return date ? date.dateFormat('M d, Y') : '';
},
renderDateTime: function(date){
if (!date) {
return '';
}
var now = new Date();
var d = now.clearTime(true);
var notime = date.clearTime(true).getTime();
if (notime == d.getTime()) {
return 'Today ' + date.dateFormat('g:i a');
}
d = d.add('d', -6);
if (d.getTime() <= notime) {
return date.dateFormat('D g:i a');
}
return date.dateFormat('n/j g:i a');
},
/**
* Italic Custom renderer function
* takes val and renders it in italics
* @param {Object} val
*/
renderItalic: function(data, metadata, record, rowIndex, columnIndex, store){
return '' + data + '';
},
/**
* Percent Custom renderer function
* takes 'data' and renders it red or green with %
*/
renderPctChange: function(data, metadata, record, rowIndex, columnIndex, store){
var p = (parseFloat(data) * 100.0).toFixed(1);
var qtip = '>';
if (data >= 0) {
//meta.css = 'green-cls';
qtip = " qtip='yeah'/>";
return '';
} else if (data < 0) {
//meta.css = 'red-cls';
qtip = " qtip='woops'/>";
return '';
}
//css:
//.red-cls {color: red;}
//.green-cls {color: green;}
return data;
},
/**
* Red/Green Custom renderer function
* takes val and renders it red if <0 otherwise renders it green
* @param {Object} val
*/
renderPosNeg: function(data, metadata, record, rowIndex, columnIndex, store){
if (data >= 0) {
return '' + data + '';
} else if (data < 0) {
return '' + data + '';
}
return data;
},
/**
* Risk Custom renderer function
* Renders according to risk level
* @param {Object} val
*/
renderRisk: function(data, metadata, record, rowIndex, columnIndex, store){
switch (data) {
case "high":
metadata.css = "redcell";
return "high";//display 'high' in the cell (could be
//we could display anything here
//"High","Hi","yup"...anything
case "medium":
return "medium";
case "low":
return "low";
default:
return data;
}
},
/**
* Star Custom renderer function
* Renders a picture according to value
* @param {Object} val
*/
renderStars: function(data, metadata, record, rowIndex, columnIndex, store){
switch (data) {
case "1":
metadata.css = "stars1";
return 1;//returns text over the background image
case "2":
metadata.css = "stars2";
return;//just shows the background image
case "3":
metadata.css = "stars3";
return;
case "4":
metadata.css = "stars4";
return;
case "5":
metadata.css = "stars5";
return;
default:
return data;
}
}
,renderQtip: function(data, metadata, record, rowIndex, columnIndex, store){
metadata.attr = 'ext:qtip="' + data + '"';
return data;
}
}, config));
};
Ext.onReady(function(){
var vp = new Ext.Viewport({
layout:'fit',
items: [app.getMetaGrid({
border: false
})]
});
});