PDA

View Full Version : Issues with Explorer11



denisputnam
1 May 2014, 9:02 AM
I am seeing issues with Explorer 11 in that it will not display ExtJs applications. I think it is having issues with the boot or bootstrap.css. Does anyone have this issue and if so, what would be a solution?

I have enabled active scripting in the internet options under the security tab.

Gary Schlosberg
1 May 2014, 11:19 AM
Haven't heard of anything like this. Can you reproduce it in a Fiddle?
https://fiddle.sencha.com/#home

denisputnam
1 May 2014, 3:07 PM
That would be difficult, but here is a link to an application that I have written:

http://pacific-oasis-5986.herokuapp.com/myschoolapp

Try it in explorer11 and firefox. It works in firefox.

Please let me know if I can provide you something else.

Gary Schlosberg
1 May 2014, 3:53 PM
I get several uncaught ReferenceErrors in all browsers. Perhaps IE11 is not handling something gracefully. I do confirm the same display problem of your app in IE11. In IE11, I see a third error as well:
Function.prototype.apply: Array or arguments object expected

You seem to be running 4.2.0, which was released before IE11. While not supported, it certainly shouldn't fail this way. and indeed this is the first I've heard of this. It is difficult to troubleshoot anything without being able to see code.

Gary Schlosberg
1 May 2014, 3:55 PM
Your site doesn't seem to work in any versions of IE, which leads me to think perhaps you have a trailing comma somewhere. You might try running your code through JSLint to catch those.

denisputnam
1 May 2014, 4:29 PM
That is interesting since I am using Architect 3 and this happens on two different applications.

Is there a JSLint command line utility that can check entire directories?

Here is the code of current app I am working on that doesn't work either. I ran it through JSLint.com and there wasn't anything significant. Is it possible that the ExtJs libraries have this problem?


// @require @packageOverridesExt.Loader.setConfig({
enabled: true
});




Ext.application({
models: [
'aggregate.AggregateModel'
],
stores: [
'aggregate.AggregateStore'
],
views: [
'MyPanel',
'aggregate.GridPanel'
],
controllers: [
'aggregate.AggregateController'
],
name: 'EsmartAggregate',


launch: function() {
Ext.create('EsmartAggregate.view.MyPanel', {renderTo: Ext.getBody()});
}


});
Ext.define('EsmartAggregate.controller.aggregate.AggregateController', {
extend: 'Ext.app.Controller',
alias: 'controller.aggregatecontroller',


stores: [
'aggregate.AggregateStore'
],
views: [
'aggregate.GridPanel'
],


onAggregategridpanelViewReady: function(tablepanel, eOpts) {
console.log('AggregateController.onAggregategridpanelViewReady()');
var mystore = Ext.getStore('aggregate.AggregateStore');
mystore.load({
callback: this.onMyStoreLoad,
scope: this,
params: {
buildingid: 'CT0013',
floorids: '01,02',
thematic_type: 'AGR'
}
}
);


},


onMyStoreLoad: function() {
var myStore = Ext.getStore('aggregate.AggregateStore');
debugger;
},


init: function(application) {
this.control({
"#aggregategridpanel": {
viewready: this.onAggregategridpanelViewReady
}
});
}


});
Ext.define('EsmartAggregate.view.MyPanel', {
extend: 'Ext.panel.Panel',


requires: [
'EsmartAggregate.view.aggregate.GridPanel',
'Ext.grid.Panel'
],


height: 535,
width: 1256,
autoScroll: true,
title: 'My Panel',


initComponent: function() {
var me = this;


Ext.applyIf(me, {
items: [
{
xtype: 'aggregategridpanel',
forceFit: false
}
]
});


me.callParent(arguments);
}


});
Ext.define('EsmartAggregate.view.aggregate.GridPanel', {
extend: 'Ext.grid.Panel',
alias: 'widget.aggregategridpanel',


requires: [
'Ext.grid.View',
'Ext.grid.column.Number'
],


itemId: 'aggregategridpanel',
title: 'My Grid Panel',
forceFit: true,
store: 'aggregate.AggregateStore',


initComponent: function() {
var me = this;


Ext.applyIf(me, {
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'fillStyle',
text: 'FillStyle'
},
{
xtype: 'gridcolumn',
dataIndex: 'spaceCategory',
text: 'SpaceCategory'
},
{
xtype: 'gridcolumn',
dataIndex: 'spaceCategoryName',
text: 'SpaceCategoryName'
},
{
xtype: 'gridcolumn',
dataIndex: 'agencyCode',
text: 'AgencyCode'
},
{
xtype: 'gridcolumn',
dataIndex: 'agencyName',
text: 'AgencyName'
},
{
xtype: 'gridcolumn',
dataIndex: 'asaNum',
text: 'AsaNum'
},
{
xtype: 'numbercolumn',
dataIndex: 'spaceQuantity',
text: 'SpaceQuantity'
},
{
xtype: 'numbercolumn',
dataIndex: 'parkingStreetQuantity',
text: 'ParkingStreetQuantity'
},
{
xtype: 'numbercolumn',
dataIndex: 'parkingSuQuantity',
text: 'ParkingSurfaceQuantity'
},
{
xtype: 'numbercolumn',
dataIndex: 'antennaQuantity',
text: 'AntennaQuantity'
},
{
xtype: 'numbercolumn',
dataIndex: 'spaceSurface',
text: 'SurfaceSquareFootage'
},
{
xtype: 'gridcolumn',
dataIndex: 'floorIds',
text: 'FloorIds'
}
]
});


me.callParent(arguments);
}


});
Ext.define('EsmartAggregate.store.aggregate.AggregateStore', {
extend: 'Ext.data.Store',
alias: 'store.aggregatestore',


requires: [
'EsmartAggregate.model.aggregate.AggregateModel',
'Ext.data.proxy.Rest',
'Ext.data.reader.Json'
],


constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
autoLoad: false,
model: 'EsmartAggregate.model.aggregate.AggregateModel',
storeId: 'aggregate.AggregateStore',
proxy: {
type: 'rest',
url: '/esmart/aggregate',
headers: {
Accept: 'application/json'
},
reader: {
type: 'json',
root: 'data'
}
}
}, cfg)]);
}
});
Ext.define('EsmartAggregate.model.aggregate.AggregateModel', {
extend: 'Ext.data.Model',
alias: 'model.aggregatemodel',


requires: [
'Ext.data.Field'
],


fields: [
{
name: 'fillStyle',
type: 'string'
},
{
name: 'spaceCategory',
type: 'string'
},
{
name: 'spaceCategoryName',
type: 'string'
},
{
name: 'agencyCode',
type: 'string'
},
{
name: 'agencyName',
type: 'string'
},
{
name: 'asaNum',
type: 'string'
},
{
name: 'spaceQuantity',
type: 'int'
},
{
name: 'parkingStreetQuantity',
type: 'int'
},
{
name: 'parkingSuQuantity',
type: 'int'
},
{
name: 'antennaQuantity',
type: 'int'
},
{
name: 'spaceSurface',
type: 'float'
},
{
name: 'floorIds',
type: 'string'
}
]
});

denisputnam
2 May 2014, 6:51 AM
I have attached the JSLint of my application including all the extjs libraries. I tried attaching the zip of the application but the Upload won't let me attach a 26.5MB file.

I think that this is a real bug.

denisputnam
2 May 2014, 7:03 AM
I have posted this as a bug for ExtJs4.2.

http://www.sencha.com/forum/showthread.php?285037-ExtJs4.2-does-not-display-in-any-IE-browser.&p=1042591#post1042591

skirtle
2 May 2014, 9:07 AM
If you follow the stacktrace you'll find the problem pretty much immediately:

Line 52, SubjectsController.js:


this.callParent(this.processSubjectSubjectsController(cfg));

The value you're passing to callParent needs to be an array or an arguments object.

denisputnam
2 May 2014, 11:05 AM
This part of the code was generated by Architect and it will not allow me to edit it. Given that it works in IE under extjs 4.1, I don't think this is the problem.


constructor: function(cfg) { cfg = cfg || {};
this.callParent(this.processSubjectSubjectsController(cfg));
},

aconran
2 May 2014, 12:00 PM
IE is choking on dojo and Spring being accessed.

Can you make sure that they are being included or can you remove the following lines?


<script type="text/javascript">
dojo.require('dijit.TitlePane');
</script>

<div id="_title_title_id">
<script type="text/javascript">
Spring.addDecoration(new Spring.ElementDecoration({elementId : '_title_title_id', widgetType : 'dijit.TitlePane', widgetAttrs : {title: 'MySchoolApp', open: true}}));
</script>
</div>

denisputnam
2 May 2014, 12:57 PM
I will try that, but can you explain to me why the example in Architect3 for the car listing also does not work? I created it without any changes and deployed it to my Weblogic app server and it will not display properly. It puts text in the web page.

Please also keep in mind that the MySchool app did display properly in framework4.1.

aconran
2 May 2014, 1:20 PM
Denis -

Sounds like your css isn't getting included. If you use web developer tools do you get failed includes via 404/403/500 etc?

denisputnam
2 May 2014, 2:10 PM
no it doesn't. in the car listing example it does display text, but not the app.

aconran
2 May 2014, 2:44 PM
Link?

denisputnam
2 May 2014, 4:49 PM
Okay, I was able to solve this problem. It appears to be something to do with the neptune theming. I switched the framework to the commercial version, deleted the neptune theming and then set it back again and now it displays in the car listing application in explorer.