2 Attachment(s)
[CLOSED] Calendar Panel - Does not show Customised Event window on some machines
I have Ext.Net 4.2 Version.
I have customised Calendar Panel Event window. This works fine on most of the clients. But displays original Event window on some client PC's with IE9.
Here, I would like to mention that, some clients with same version of IE9 it works great! We have compared all browser related options on working and non working clients.
Following is the code to customise the EventWindow
Code:
<script type="text/javascript">
Ext.calendar.form.EventWindow.override({
constructor: function(config) {
var formPanelCfg = {
xtype: 'form',
fieldDefaults: {
msgTarget: 'side',
labelWidth: 65
},
frame: false,
bodyStyle: 'background:transparent;padding:5px 10px 10px;',
bodyBorder: false,
border: false,
items: [{
itemId: 'title',
name: Ext.calendar.data.EventMappings.Title.name,
fieldLabel: 'Title',
xtype: 'textfield',
anchor: '100%'
},
{
xtype: 'daterangefield',
itemId: 'date-range',
name: 'dates',
anchor: '100%',
fieldLabel: 'When'//,
//hidden: true
}]
};
if (config.calendarStore) {
this.calendarStore = config.calendarStore;
delete config.calendarStore;
formPanelCfg.items.push({
xtype: 'calendarpicker',
itemId: 'calendar',
name: Ext.calendar.data.EventMappings.CalendarId.name,
anchor: '100%',
store: this.calendarStore,
hidden: true
});
}
// CUSTOMIZATION
// 1. Adds one more standard field.
formPanelCfg.items.push({
itemId: 'Location',
name: Ext.calendar.data.EventMappings.Location.name,
fieldLabel: 'Location',
xtype: 'textfield',
anchor: '100%',
hidden: true
});
// 2. Add Customised fields
formPanelCfg.items.push({
itemId: 'EmployeeId',
name: Ext.calendar.data.EventMappings.EmployeeId.name,
fieldLabel: 'Employee',
xtype: 'textfield',
anchor: '100%',
hidden: true
});
formPanelCfg.items.push({
itemId: 'ProjectId',
name: Ext.calendar.data.EventMappings.ProjectId.name,
fieldLabel: 'Project',
xtype: 'combobox',
anchor: '100%',
dataIndex: 'ProjectId',
valueField: 'ProjectId',
displayField: 'Code',
store: 'projectStore',
columnWidth: .5,
anchor: '100%',
selectOnFocus: true,
typeAhead: true
});
formPanelCfg.items.push({
xtype: 'fieldcontainer',
layout: 'column',
items: [
{ itemId: 'DepartmentId',
name: Ext.calendar.data.EventMappings.DepartmentId.name,
fieldLabel: 'Department',
xtype: 'combobox',
dataIndex: 'DepartmentId',
valueField: 'DepartmentId',
displayField: 'Name',
store: 'departmentStore',
columnWidth: .5,
anchor: '100%',
selectOnFocus: true,
typeAhead: true,
listeners: {
scope: CompanyX,
'select': CompanyX.selectDepartment
}
},
{
itemId: 'SectionId',
name: Ext.calendar.data.EventMappings.SectionId.name,
fieldLabel: 'Section',
xtype: 'combobox',
columnWidth: .49,
dataIndex: 'SectionId',
valueField: 'SectionId',
displayField: 'Code',
store: 'sectionStore',
columnWidth: .49,
anchor: '100%',
selectOnFocus: true,
typeAhead: true
//forceSelection: true,
//pageSize: 10,
//minChars: 1,
//matchFieldWidth: false
//disabled: true
},
{
xtype: 'button',
//text: 'Help',
disabled: false,
handler: CompanyX.showSectionHelp,
scope: CompanyX,
iconCls: 'icon-help'
}]
});
// END OF CUSTOMIZATION
this.callParent([Ext.apply({
titleTextAdd: 'Add Event',
titleTextEdit: 'Edit Event',
width: 600,
autocreate: true,
border: true,
closeAction: 'hide',
modal: false,
resizable: false,
buttonAlign: 'left',
savingMessage: 'Saving changes...',
deletingMessage: 'Deleting event...',
layout: 'fit',
fbar: [{
xtype: 'tbtext',
text: '<a href="#" id="tblink">Edit Details...</a>',
hidden: true
},
'->', {
text: 'Save',
disabled: false,
handler: this.onSave,
scope: this
},
{
itemId: 'delete-btn',
text: 'Delete',
disabled: false,
handler: this.onDelete,
scope: this,
hideMode: 'offsets'
},
{
text: 'Cancel',
disabled: false,
handler: this.onCancel,
scope: this
}],
items: formPanelCfg
},
config)]);
}
});
</script>
Screen shot that is generated on some non-working machines is as follows
http://forums.ext.net/attachment.php...id=11351&stc=1
Screen shot on working machines
http://forums.ext.net/attachment.php...id=11361&stc=1
