Code:
var sm3 = new Ext.grid.CheckboxSelectionModel();
var InboxGrid = new Ext.data.Record.create( [
{name: 'company'},
{name: 'price'},
{name: 'pctChange',type: 'date', dateFormat: 'n/j h:ia'},
{name: 'industry'},
{name: 'change'}
]);
var readerInbox = new Ext.data.XmlReader( {
totalRecords: 'recCount',
record: 'Inbox',
id:'ID'
}, InboxGrid );
var grid3store = new Ext.data.Store({
// Both of these lines cause the same results in firefox
//url: 'Grids.xml',
proxy: new Ext.data.HttpProxy({url: 'Grids.xml'}),
reader: readerInbox,
listeners: {
'loadexception': {
fn: function(httpProxy, dataObject, arguments, exception) {
console.log('** - Data Store listener fired (loadexception), arguments:', arguments);
console.log('** - Data Store listener fired (loadexception), httpProxy:', httpProxy);
},
scope: this
},
'load':{
fn: function(store, records, options){
console.log('01 - Data Store listener fired (load), arguments:',arguments);
console.log(' this:',this);
},
scope: this
}
//add remaining events for education:
,'add':{
fn: function(store, records, index){
console.log('Data Store listener fired (add), arguments:',arguments);
}
,scope:this
}
,'beforeload':{
fn: function(store, options){
console.log('Data Store listener fired fired (beforeload), arguments:',arguments);
}
,scope:this
}
,'clear':{
fn: function(store){
console.log('Data Store listener fired fired (clear), arguments:',arguments);
}
,scope:this
}
,'datachanged':{
fn: function(store){
console.log('11 - Data Store listener fired fired (datachanged), arguments:',arguments);
console.log(' If you set a breakpoint here the entire grid will be rendered without data');
console.log(' ...about to "refresh" grid body');
}
,scope:this
}
,'remove':{
fn: function(store, record, index){
console.log('Data Store listener fired fired (remove), arguments:',arguments);
}
,scope:this
}
,'update':{
fn: function(store, record, operation){
console.log('Data Store listener fired fired (update), arguments:',arguments);
}
,scope:this
}
}
});
grid3store.load();
SampleGrid3 = function(limitColumns){
var columns3 = [
sm3,
{header: "Title", width: 210, sortable: true, dataIndex: 'company'},
{header: "From", width: 120, sortable: true, dataIndex: 'price'},
{header: "Date", width: 105, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'pctChange'},
{header: "Status", width: 100, sortable: true, dataIndex: 'industry'},
{header: "Type", width: 180, sortable: true, dataIndex: 'change'}
];
SampleGrid3.superclass.constructor.call(this, {
store: grid3store,
sm: sm3,
columns: columns3,
frame:true,
height:60,
width:500,
id:'grid3',
buttonAlign:'left',
buttons: [{text:'New'}, {
text:'Remove',
handler: function() {
var selectedRows = sm3.getSelections();
for (i = 0; i < selectedRows.length; i++) {
grid3store.remove(sm3.selections.items[i]);
i--;
selectedRows.length--;
}
}
}
]
});
}
Ext.extend(SampleGrid3, Ext.grid.GridPanel);
// html file
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head>
<meta http-equiv="Content-Type" content="text/xml; charset=iso-8859-1">
<html>
<head>
<title>Custom Layouts and Containers - Portal Sample</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="../../resources/css/xtheme-slate.css" />
<!-- GC -->
<!-- LIBS -->
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<!-- <script type="text/javascript" src="../../ext-all.js"></script> -->
<script type="text/javascript" src="../../ext-all-debug.js"></script>
<script type="text/javascript" src="../../ext-basex.js"></script>
<!-- ENDLIBS -->
<script type="text/javascript" src="../form/states.js"></script>
<script type="text/javascript" src="create-grid.js"></script>
<script type="text/javascript" src="Toolbar.js"></script>
<style type="text/css">
.x-toolbar {
overflow: hidden;
}
.x-toolbar-left {
float: left;
}
.x-toolbar-right {
float: right;
}
.x-toolbar .ytb-text {
line-height: 1.5em;
}
</style>
<script type="text/javascript" src="Portal.js"></script>
<script type="text/javascript" src="RowExpander.js"></script>
<script type="text/javascript" src="PortalColumn.js"></script>
<script type="text/javascript" src="Portlet.js"></script>
<link rel="stylesheet" type="text/css" href="portal.css" />
<link rel="stylesheet" type="text/css" href="sample.css" />
<script type="text/javascript" src="quickdetail.js"></script>
<script type="text/javascript" src="searchbaraddin.js"></script>
<link rel="stylesheet" type="text/css" href="columnLock.css">
<script type="text/javascript" src="columnLock.js"></script>
<script type="text/javascript" src="grid3.js"></script>
</head>
<body>
<script type="text/javascript" src="../examples.js"></script><!-- EXAMPLES -->
</body>
</html>
// Code line that you specified to include
Ext.onReady(function(){
Ext.state.Manager.clear();
Ext.lib.Ajax.forceActiveX = true; //for IE
.....
ext-basex 2.3 Released (with priority queuing)
), I've introduced named-queuing (with priorities) to ext-basex.
)
Reply With Quote
