我的代码块出现问题。它在IE11和Firefox上运行顺畅,但是当我使用chrome检查它时,它不起作用。
这是我的代码
Ext.define('ralph.view.customer.main.orderGrid', {
extend: 'Ext.container.Container',
layout:'fit',
initComponent: function() {
var me = this;
var basePanel = new Ext.form.FormPanel({
id: 'orderBody',
layout:'fit',
border: false,
items : [
{
xtype: 'panel',
id: 'orderTab',
layout: {
type: 'fit'
},
title: 'Orders',
items: [
{
xtype: 'gridpanel',
id: 'ordersGrid',
viewConfig : {
getRowClass : function(r,rowIndex,rowsParams,store){
return r.get('saved')?'saved-record-row':'';
}
},
/* store: Ext.create('ralph.store.ordersStore', {
listeners : {
callback : function(store,records,operation,success){
if(!success){
var error=operation.getError();
if(typeof error == 'string'){
Ext.Msg.alert('Error','Error occur with message<br />'+error);
}else{
Ext.Msg.alert('Error','Connection failed<br />Staus code: '+error.status);
}
}
}
}
}),*/
store : 'ordersStore',
features:[filtersOrder],
columns: [
{
xtype: 'gridcolumn',
hidden: true,
hideable: false,
dataIndex: 'number',
text: 'Internal Number'
},
{
xtype: 'gridcolumn',
dataIndex: 'raw_tms_order_id',
text: 'Order Number',
filterable: true,
filter: {type: 'string'}
},
{
xtype: 'gridcolumn',
dataIndex: 'quote_id',
text: 'Quote Number'
},
{
xtype: 'gridcolumn',
dataIndex: 'transaction_type',
text: 'Import/Export'
},
{
xtype: 'gridcolumn',
dataIndex: 'order_date',
text: 'Order Date'
},
{
xtype: 'gridcolumn',
dataIndex: 'status',
text: 'Status'
},
{
xtype: 'gridcolumn',
dataIndex: 'status_date',
text: 'Status Date'
},
{
xtype: 'gridcolumn',
dataIndex: 'company',
text: 'Company',
hidden: true
},
{
xtype: 'gridcolumn',
dataIndex: 'contact_name',
text: 'Contact Name',
hidden: true
},
{
xtype: 'gridcolumn',
dataIndex: 'phone',
text: 'Phone',
hidden: true
},
{
xtype: 'gridcolumn',
dataIndex: 'email',
text: 'Email',
hidden: true
},
{
xtype: 'gridcolumn',
dataIndex: 'consignee',
text: 'Consignee/Consignor',
filterable: true
},
{
xtype: 'gridcolumn',
dataIndex: 'ori_dest',
text: 'Origin/Destination'
},
{
xtype: 'gridcolumn',
dataIndex: 'reference_no',
text: 'Reference No.'
},
{
xtype: 'gridcolumn',
dataIndex: 'carrier',
text: 'Carrier'
},
{
xtype: 'gridcolumn',
dataIndex: 'vessel',
text: 'Vessel'
},
{
xtype: 'gridcolumn',
dataIndex: 'voyage',
text: 'Voyage'
},
{
xtype: 'gridcolumn',
dataIndex: 'booking',
text: 'Booking'
},
{
xtype: 'gridcolumn',
dataIndex: 'etaetdlrd',
text: 'Eta/Etd/Lrd'
},
{
xtype: 'gridcolumn',
dataIndex: 'user_id',
text: 'User'
}
],
listeners: {
selectionchange: function(model, records) {
var r=null;
if(records.length==1 && (r=records[0]) && r.get('saved')){
Ext.getCmp('btnOrderBook').enable();
Ext.getCmp('btnOrderBook').setDisabled(false);
}else{
Ext.getCmp('btnOrderBook').disable();
Ext.getCmp('btnOrderBook').setDisabled(true);
}
enableOrderButtons(records);
},
itemdblclick: this.viewOrder
},
dockedItems: [
{
xtype: 'pagingtoolbar',
id: 'ordersPagingToolbar',
displayInfo: true,
store: 'ordersStore',
dock: 'bottom'
}
]
}
]
}
]
});
Ext.applyIf(me, {
items: [
basePanel
]
});
me.callParent(arguments);
},
viewOrder: function(grid, record) {
var gridForm = Ext.getCmp('ordersGrid');
var record = gridForm.getSelectionModel().getSelection()[0];
$.history.load('EditOrder.' +record.get('id'));
}
});
var filtersOrder = {
ftype: 'filters',
// encode and local configuration options defined previously for easier reuse
encode: true, // json encode the filter query
local: false, // defaults to false (remote filtering)
filters:[
{type: 'numeric', dataIndex: 'number'},
{type: 'numeric', dataIndex: 'quote_id'},
{type: 'date', dataIndex: 'order_date', dateFormat: 'Y-m-d H:i:s'},
{
type: 'list',
dataIndex: 'status',
options: ['requested', 'accepted', 'dispatched', 'pickedup', 'delivered', 'allinprocess', 'completed'],
phpMode: true
},
{type: 'date', dataIndex: 'status_date'},
{
type: 'list',
dataIndex: 'transaction_type',
options: ['import', 'export'],
phpMode: true
},
{type: 'string', dataIndex: 'company'},
{type: 'string', dataIndex: 'contact_name'},
{type: 'numeric', dataIndex: 'phone'},
{type: 'string', dataIndex: 'email'},
{type: 'numeric', dataIndex: 'reference_no'},
{type: 'numeric', dataIndex: 'carrier'},
{type: 'numeric', dataIndex: 'vessel'},
{type: 'numeric', dataIndex: 'voyage'},
{type: 'numeric', dataIndex: 'booking'},
{type: 'numeric', dataIndex: 'etaetdlrd'},
{
type: 'combo',
dataIndex : 'user_id',
store:Ext.create('Ext.data.JsonStore',{
fields : ['id','name'],
proxy : {
type : 'ajax',
url : '/users/filterdata',
reader : {
type : 'json',
root : 'root',
idProperty : 'id',
totalProperty : 'total'
}
}
}),
displayField : 'name',
valueField : 'id',
width : 300,
queryMode : 'remote',
pageSize : true
}
/* (function(){
var opt={};
var filter={type: 'list', dataIndex: 'user_id',options:opt};
Ext.Ajax.request({
url : 'users/filterdata',
success : function(response){
var res=response.responseText;
res=Ext.decode(res);
filter.options=res;
}
});
return filter;
})() // */
]
};
function enableOrderButtons(records) {
Ext.getCmp('btnOrderEdit').setDisabled(false);
Ext.getCmp('btnOrderCancel').setDisabled(false);
Ext.getCmp('btnOrderDuplicate').setDisabled(false);
Ext.getCmp('btnOrderBook').setDisabled(false);
Ext.getCmp('btnOrderBook').enable();
}
function disableOrderButtons() {
Ext.getCmp('btnOrderEdit').setDisabled(true);
Ext.getCmp('btnOrderView').setDisabled(true);
Ext.getCmp('btnOrderCancel').setDisabled(false);
Ext.getCmp('btnOrderDuplicate').setDisabled(true);
Ext.getCmp('btnOrderBook').setDisabled(true);
Ext.getCmp('btnOrderBook').disable();
}
// ORDER GRID
var orderGridBody = Ext.create('ralph.view.customer.main.orderGrid');
var orderGrid = Ext.getCmp('ordersGrid');
var orderIeCombo = Ext.getCmp('orderIeCombo');
orderIeCombo.on('select', function() {
switch (orderIeCombo.getValue()) {
case 'Import':
orderGrid.getStore().filters.add('transtaction_type', new Ext.util.Filter({
property: 'transaction_type',
value: 'import'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Export':
orderGrid.getStore().filters.add('transtaction_type', new Ext.util.Filter({
property: 'transaction_type',
value: 'export'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case '-':
orderGrid.getStore().filters.removeAtKey('transtaction_type');
orderGrid.getStore().load({page: 1,start: 0});
break;
}
});
var orderStatusCombo = Ext.getCmp('orderStatusCombo');
orderStatusCombo.on('select', function() {
switch (orderStatusCombo.getValue()) {
case 'Requested':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'requested'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Accepted':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'requested'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Available':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'available'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Dispatched':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'acknldged'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Picked up':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'picked up'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Delivered':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'delivered'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'All in process':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'accepted,dispatched,picked up,delivered'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Completed':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'completed'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Cancelled':
orderGrid.getStore().filters.add('status', new Ext.util.Filter({
property: 'status',
value: 'cancelled'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case '-':
orderGrid.getStore().filters.removeAtKey('status');
orderGrid.getStore().load({page: 1,start: 0});
break;
}
});
var branchItemClick = function(item){
Ext.getCmp('orderBranchesMenu').items.items.forEach(function(ele){
ele.removeCls('itemHighlighted');
});
item.addClass('itemHighlighted');
orderGrid.getStore().filters.add('branch_id', new Ext.util.Filter({
property: 'branch_id',
value: item.value
}));
if(orderGrid.getStore().filters.get('department_id') != undefined){
orderGrid.getStore().filters.removeAtKey('department_id');
}
orderGrid.getStore().load({page: 1,start: 0});
var deptSubMenu = Ext.getCmp('orderDeptMenu');
deptSubMenu.removeAll();
var url = '/departments?branchid='+item.value;
var navStore = Ext.create('Ext.data.Store', {
fields: ['text'],
proxy: {
type: 'ajax',
url: url,
reader: {
type: 'json',
root: 'data',
idProperty: 'id'
},
writer: {
type: 'json'
}
},
autoLoad: true,
listeners: {
load: function(store,records,success,operation,opts) {
store.each(function(record) {
var menu = Ext.create('Ext.menu.Menu');
deptSubMenu.add({
xtype: 'menuitem',
text: record.raw.name,
value:record.raw.id,
hideOnClick: true,
handler: deptItemClick
});
});
}
}
});
};
var deptItemClick = function(item) {
Ext.getCmp('orderDeptMenu').items.items.forEach(function(ele){
ele.removeCls('itemHighlighted');
});
item.addClass('itemHighlighted');
orderGrid.getStore().filters.add('department_id', new Ext.util.Filter({
property: 'department_id',
value: item.value
}));
if(orderGrid.getStore().filters.get('branch_id') != undefined){
orderGrid.getStore().filters.removeAtKey('branch_id');
}
orderGrid.getStore().load({page: 1,start: 0});
};
var orderCreatedCombo = Ext.getCmp('orderCreatedCombo');
orderCreatedCombo.on('select', function() {
switch (orderCreatedCombo.getValue()) {
case 'Last week':
orderGrid.getStore().filters.add('order_date', new Ext.util.Filter({
property: 'order_date',
value: '1 week'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Last 2 weeks':
orderGrid.getStore().filters.add('order_date', new Ext.util.Filter({
property: 'order_date',
value: '2 weeks'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case 'Last 30 days':
orderGrid.getStore().filters.add('order_date', new Ext.util.Filter({
property: 'order_date',
value: '30 days'
}));
orderGrid.getStore().load({page: 1,start: 0});
break;
case '-':
orderGrid.getStore().filters.removeAtKey('order_date');
orderGrid.getStore().load({page: 1,start: 0});
break;
}
});
var searchByCleanTmsId = Ext.getCmp('searchByCleanTmsId');
searchByCleanTmsId.on('click',function(){
if(Ext.getCmp('findByOrderNumber').getValue() == ''){
orderGrid.getStore().filters.removeAtKey('clean_tms_order_id');
orderGrid.getStore().load({page: 1,start: 0});
}
else{
orderGrid.getStore().filters.add('clean_tms_order_id', new Ext.util.Filter({
property: 'clean_tms_order_id',
value: Ext.getCmp('findByOrderNumber').getValue()
}));
orderGrid.getStore().load({page: 1,start: 0});
}
});
希望有人可以帮助我,我在监听区域中使用两种类型的条件启用了btnOrderBook,首先是
Ext.getCmp('btnOrderBook').disable();
接下来是
Ext.getCmp('btnOrderBook').setDisabled(true);
但它仍然不起作用。