Created
February 18, 2010 17:46
-
-
Save nickweavers/307886 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(function() { | |
var personFields = [ | |
{name: 'id_person', type: 'string', mapping: 'id_person'}, | |
{name: 'id_person_ref', type: 'string', mapping: 'id_person'}, | |
{name: 'first_name', type: 'string', mapping: 'first_name'}, | |
{name: 'initials', type: 'string', mapping: 'initials'}, | |
{name: 'last_name', type: 'string', mapping: 'last_name'}, | |
{name: 'id_title', type: 'string', mapping: 'id_title'}, | |
{name: 'title', type: 'string', mapping: 'title'}, | |
{name: 'address_line1', type: 'string', mapping: 'address_line1'}, | |
{name: 'address_line2', type: 'string', mapping: 'address_line2'}, | |
{name: 'town', type: 'string', mapping: 'town'}, | |
{name: 'city', type: 'string', mapping: 'city'}, | |
{name: 'county', type: 'string', mapping: 'county'}, | |
{name: 'postcode', type: 'string', mapping: 'postcode'}, | |
{name: 'telephone', type: 'string', mapping: 'telephone'}, | |
{name: 'mobile', type: 'string', mapping: 'mobile'}, | |
{name: 'employee_cb', type: 'string', mapping: 'employee_cb'}, | |
{name: 'applicant_cb', type: 'string', mapping: 'applicant_cb'}, | |
{name: 'client_cb', type: 'string', mapping: 'client_cb'}, | |
{name: 'id_personnel', type: 'string', mapping: 'id_personnel'}, | |
{name: 'id_applicant', type: 'string', mapping: 'id_applicant'}, | |
{name: 'id_client', type: 'string', mapping: 'id_client'} | |
]; | |
var personStore = new Ext.data.JsonStore({ | |
url: 'index.php', | |
baseParams: { | |
option: 'com_opsuk-backoffice', | |
view: 'persons', | |
layout: 'personRecords', | |
format: 'raw' | |
}, | |
totalProperty:'totalCount', | |
root: 'rows', | |
idProperty: 'id_person', | |
remoteSort: true, | |
fields: personFields | |
}); | |
var titleStore = new Ext.data.JsonStore({ | |
url: 'index.php', | |
baseParams: { | |
option: 'com_opsuk-backoffice', | |
view: 'persons', | |
layout: 'personTitlesCombo', | |
format: 'raw' | |
}, | |
root: 'rows', | |
fields : ['id_title', 'title'], | |
autoLoad: true | |
}); | |
var titleCombo = new Ext.form.ComboBox({ | |
store: titleStore, | |
displayField: 'title', | |
valueField: 'id_title', | |
editable: false, | |
mode: 'remote', | |
forceSelection: true, | |
emptyText: 'Select a title...', | |
triggerAction: 'all', // without this the combo won't load from the store! | |
fieldLabel: 'Title', | |
name: 'title', | |
hiddenName: 'id_title', | |
allowBlank: false | |
}); | |
var formButtons = [ | |
//new Ext.Toolbar.Fill(), | |
{ | |
text: 'Save', | |
handler: function() { | |
personForm.getForm().submit({ | |
success: function(formObj, actionObj) { | |
if (actionObj.result.success == 'false') { | |
var msg = 'success = ' + actionObj.result.success + | |
', errors = ' + actionObj.result.errors.error_msg; | |
Ext.MessageBox.alert({ | |
title:'Error', | |
msg: msg, | |
minWidth: msg.length, | |
}); | |
} else { | |
personStore.load({params:{start:0, limit:5}}); | |
} | |
}, | |
failure: function(f, a) { | |
Ext.Msg.alert('Warning', 'Error'); | |
} | |
}); | |
} | |
} | |
]; | |
var personRoleFieldset = { | |
xtype: 'fieldset', | |
labelWidth: 90, | |
title: 'Role', | |
layout: 'column', | |
buttons: formButtons, | |
buttonAlign: 'left', | |
items: [{ | |
// Fieldset in Column 1 | |
xtype: 'fieldset', | |
columnWidth: 0.3, | |
defaultType: 'checkbox', | |
border: false, | |
items: [{ | |
id: 'employee_cb', | |
fieldLabel: 'Employee', | |
name: 'employee_cb' | |
},{ | |
id: 'applicant_cb', | |
fieldLabel: 'Applicant', | |
name: 'applicant_cb' | |
},{ | |
id: 'client_cb', | |
fieldLabel: 'Client', | |
name: 'client_cb' | |
}] | |
},{ | |
// Fieldset in Column 1 | |
xtype: 'fieldset', | |
columnWidth: 0.4, | |
defaults: { width: 50 }, | |
defaultType: 'textfield', | |
border: false, | |
items: [{ | |
id: 'id_personnel', | |
fieldLabel: 'PersonnelID', | |
name: 'id_personnel', | |
disabled: true | |
},{ | |
id: 'id_applicant', | |
fieldLabel: 'ApplicantID', | |
name: 'id_applicant', | |
disabled: true | |
},{ | |
id: 'id_client', | |
fieldLabel: 'ClientID', | |
name: 'id_client', | |
disabled: true | |
}] | |
}] | |
}; | |
var personDetailsFieldset = { | |
xtype: 'fieldset', | |
labelWidth: 90, | |
title: 'Person details', | |
defaults: { width: 230 }, | |
defaultType: 'textfield', | |
height: 400, | |
//autoHeight: true, | |
bodyStyle: Ext.isIE ? 'padding: 0 0 5px 15px;' : 'padding: 10px 15px;', | |
items: [{ | |
id: 'id_person_ref', | |
fieldLabel: 'PersonID', | |
name: 'id_person_ref', | |
disabled: true | |
},{ | |
id: 'id_person', | |
name: 'id_person', | |
hidden: true | |
},{ | |
id: 'first_name', | |
fieldLabel: 'First name', | |
name: 'first_name' | |
},{ | |
id: 'initials', | |
fieldLabel: 'Initials', | |
name: 'initials' | |
},{ | |
id: 'last_name', | |
fieldLabel: 'Last name', | |
name: 'last_name' | |
},{ | |
//titleCombo | |
},{ | |
id: 'address_line1', | |
fieldLabel: 'Address line 1', | |
name: 'address_line1' | |
},{ | |
id: 'town', | |
fieldLabel: 'Town', | |
name: 'town' | |
},{ | |
id: 'city', | |
fieldLabel: 'City', | |
name: 'city' | |
},{ | |
id: 'county', | |
fieldLabel: 'County', | |
name: 'county' | |
},{ | |
id: 'address_line1', | |
fieldLabel: 'Address line 1', | |
name: 'address_line1' | |
},{ | |
id: 'postcode', | |
fieldLabel: 'Postcode', | |
name: 'postcode' | |
},{ | |
id: 'telephone', | |
fieldLabel: 'Telephone', | |
name: 'telephone' | |
},{ | |
id: 'mobile', | |
fieldLabel: 'Mobile', | |
name: 'mobile' | |
}] | |
}; | |
// var rowModel = Ext.data.Record.create(dataFields); | |
var grid = new Ext.grid.GridPanel({ | |
//title: 'Edit Persons', | |
stripeRows: true, | |
//autoWidth: true, | |
width: 352, | |
height: 400, | |
margin: {top:5, right:10, bottom:5, left:10}, | |
columnLines: true, | |
//loadmsk: true, | |
bbar: new Ext.PagingToolbar({ | |
store: personStore, | |
displayInfo:true, | |
pageSize:5 | |
}), | |
clicksToEdit: 1, | |
store: personStore, | |
columns: [ // fix up the column settings below | |
{header: 'PersonID', width: 70, dataIndex: 'id_person'}, | |
{header: 'FirstName', width: 80, dataIndex: 'first_name', sortable: true }, | |
{header: 'Initials', width: 60, dataIndex: 'initials', sortable: true}, | |
{header: 'LastName', width: 80, dataIndex: 'last_name', sortable: true}, | |
{header: 'Title', width: 60, dataIndex: 'title', sortable: true}, | |
], | |
listeners: { | |
}, | |
viewConfig: { | |
onLoad: Ext.emptyFn, | |
//forceFit:true, | |
listeners: { | |
beforerefresh: function(v) { | |
v.scrollTop = v.scroller.dom.scrollTop; | |
v.scrollHeight = v.scroller.dom.scrollHeight; | |
}, | |
refresh: function(v) { | |
v.scroller.dom.scrollTop = v.scrollTop + | |
(v.scrollTop == 0 ? 0 : v.scroller.dom.scrollHeight - v.scrollHeight); | |
} | |
} | |
} | |
}); | |
var personForm = new Ext.FormPanel ({ | |
title: 'Edit persons', | |
closable: true, | |
//id: 'editPersons', | |
frame: true, | |
labelAlign: 'left', | |
bodyStyle: 'padding: 5px', | |
width: 800, | |
layout: 'column', | |
bodyStyle:'padding:20px 20px 20px 20px;', | |
url: 'index.php', | |
baseParams: { | |
option: 'com_opsuk-backoffice', | |
view: 'persons', | |
layout: 'updatePersonRecord', | |
format: 'raw' | |
}, | |
items: [{ | |
// Fieldset in Column 1 | |
xtype: 'fieldset', | |
title: 'Person selection', | |
columnWidth: 0.4, | |
layout:'anchor', | |
bodyStyle:'padding:20px 20px 20px 20px', | |
tbar: [{ | |
text: 'Add new person', | |
handler: function() { | |
personForm.getForm().findField('applicant_cb').enable(); | |
personForm.getForm().findField('client_cb').enable(); | |
personForm.getForm().findField('employee_cb').enable(); | |
personForm.getForm().reset(); | |
} | |
}], | |
items: [{ | |
xtype: 'panel', | |
anchor: '100%', | |
items: [ grid ] | |
}] | |
}, { | |
// Fieldset in Column 2 - Panel inside | |
columnWidth: 0.5, | |
bodyStyle:'padding: 0px 20px 0px 20px', | |
items: [ personDetailsFieldset, personRoleFieldset ] | |
}] | |
}); | |
personStore.on('load', function(personStore, records, options) { | |
if (records && records.length > 0) { | |
grid.getSelectionModel().selectFirstRow(); | |
} | |
}); | |
personStore.load({params:{start:0, limit:5}}); | |
grid.getSelectionModel().on('rowselect', function(sm, rowindex, record) { | |
personForm.getForm().loadRecord(record); | |
// handle the id_title field | |
if (record.data.id_title != '') { | |
titleCombo.store.on('load',function(){ | |
titleCombo.setValue(record.data.id_title); | |
}); | |
//var id_titleField = Ext.query('#id_title'); | |
//id_titleField.value = record.data.id_title; | |
} | |
// Handle the check box modes | |
if (record.data.id_personnel != '') { | |
personForm.getForm().findField('employee_cb').disable(); | |
} else { | |
personForm.getForm().findField('employee_cb').enable(); | |
} | |
if (record.data.id_applicant != '') { | |
personForm.getForm().findField('applicant_cb').disable(); | |
} else { | |
personForm.getForm().findField('applicant_cb').enable(); | |
} | |
if (record.data.id_client != '') { | |
personForm.getForm().findField('client_cb').disable(); | |
} else { | |
personForm.getForm().findField('client_cb').enable(); | |
} | |
}); | |
return personForm; // return instantiated component | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment