PDA

View Full Version : FireFox click issue



pbeforeswine
28 May 2009, 4:01 AM
First things first. Sorry about the long post.

I am pretty new to EXTJS and I am having problems with running my code in FireFox.
The piece of code that follows works very well in IE. Although it is rendered correctly in FireFox, I am unable to click or activate any controls.

Does anyone have any idea what could be causing the issue.

I am using EXTJS version 2.2.1, IE version 6 and FireFox version 3.0.10

Here's the code.
1. Myportal.html

<html>
<head id="Head1">
<title>My Portal</title>
<link rel="Stylesheet" href="Lib/ExtJs/Resources/Css/ext-all.css"/>

<script type="text/javascript" src="Lib/ExtJs/Adapter/Ext/ext-base.js"></script>
<script type="text/javascript" src="Lib/ExtJs/ext-all-debug.js"></script>

<script type="text/javascript" src="GridScript.js"></script>

<script type="text/javascript">
Ext.onReady(function()
{
Ext.QuickTips.init();
var ctabPanel = createGridPanel();
var viewPort = new Ext.Viewport(
{
layout: 'border',
id: 'IncidentView',
items: [ctabPanel]
});
});
</script>
</head>
<body oncontextmenu="return false">
</body>
</html>2. GridScript.js

///
//Support and Service grid Data Store
///
var supConn = new Ext.data.Connection( {method: 'GET', Headers: {"Accept": "text/xml", "Content-Type": "text/xml"}} );
var dataStoreServiceRequests = new Ext.data.JsonStore({
proxy: new Ext.data.HttpProxy(supConn),
totalProperty: 'total',
root: 'rows', fields: [ 'Col1', 'Col2', 'Col3', 'Col4' ] });

var pagingBarSupport = new Ext.PagingToolbar({
pageSize: 25,
store: dataStoreServiceRequests,
displayInfo: true,
displayMsg: 'Displaying {0} - {1} of {2}',
emptyMsg: "No Records to display"
});

var gd_supportGrid = new Ext.grid.GridPanel({
title: 'Display records', store: dataStoreServiceRequests,
trackMouseOver: true, loadMask: true, autoSizeColumns: true,
autoExpandColumn: 'title', sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
columns :[ {header: "Description", dataIndex: 'iIncidentId', id: 'title'},
{header: "Status", dataIndex: 'vchStatusDesc', sortable: true},
{header: "Last Update", width: 170, dataIndex: 'dtModifiedDate', id: 'modifiedDate', sortable: true}],
bbar: pagingBarSupport});

var cb_daysComboMaster = new Ext.form.ComboBox({ fieldLabel: 'Limit',
store: new Ext.data.SimpleStore({fields: ['abbr', 'days'], data : [['2','2'],['7','7'],['14','14'],['30','30']]}),
valueField:'abbr', value : '7', displayField:'days',
typeAhead: true, mode: 'local', triggerAction: 'all',
readOnly: true, selectOnFocus:true, width:45});

function createGridPanel()
{
//Grid Layout
var tabPanel = new Ext.TabPanel(
{
region: 'center', id: 'serviceTabs',
activeTab: 0, autoLoad:false,
tbar:
[{
text:'Open Menu',
width:190, enableToggle:true, iconCls: '',
menu:
{
items:
[
{text:'Menu One', id: 'one1', scope:this},
{text:'Menu Two', id: 'two2', scope:this}
]
}//MENU
},
'->',
cb_daysComboMaster,
{
id: 'mycomp',
xtype: 'box',
autoEl: {cn: '&nbsp;&nbsp;days&nbsp;&nbsp;&nbsp;&nbsp;'}
}],//TOOLBAR
items: [gd_supportGrid]
});//TAB PANEL

return tabPanel;
}