PDA

View Full Version : Combo boxes just wont render :''('



desouza.trevor
19 May 2011, 12:04 AM
Hi Everyone,

I hope someone can help me with this, i've literally tried everything including pulling my hair out.

The code is below as well as the json responses.

Any help would be very much appreciated. Thanks



Ext.onReady(function() {

var clientModel=Ext.data.Record.create([{
name: 'clientId',
type: 'number'
},{
name: 'clientFirstName',
type: 'string'
},{
name: 'clientLastName',
type: 'string'
}]);

var dsClient= new Ext.data.JsonStore({
url: 'http://localhost:9090/ElixirImpl/cm/c/list.do',
root: 'root',
totalProperty: 'totalCount',
reader: new Ext.data.JsonReader({
id: 'clientId'
}, clientModel
),
autoLoad:false,
sortInfo: {
field: 'clientFirstName',
direction: 'ASC'
}
});

var dsMatterSensitivities= new Ext.data.JsonStore({
url: 'http://localhost:9090/ElixirImpl/cm/lookup/getMatterSensitivities.do',
root: 'root',
fields: ['key', 'value', 'description'],
disableCaching: false,
autoLoad: true,
sortInfo: {
field: 'key',
direction: 'ASC'
}
});

var dsBranches= new Ext.data.JsonStore({
url: 'http://localhost:9090/ElixirImpl/firm/lookup/getBranches.do',
root: 'root',
fields: ['key', 'value', 'description'],
disableCaching: false,
autoLoad: false,
sortInfo: {
field: 'key',
direction: 'ASC'
}
});

var dsBillingTypes= new Ext.data.JsonStore({
url: 'http://localhost:9090/ElixirImpl/acc_fin/lookup/getBillingTypes.do',
root: 'root',
fields: ['key', 'value', 'description'],
disableCaching: false,
autoLoad: false,
sortInfo: {
field: 'key',
direction: 'ASC'
}
});

var formPanel = new Ext.form.FormPanel({
id : 'newMatterForm',
title : 'New Matter',
applyTo : 'mainContent',
layout:'form',
bodyStyle:'padding:5px 5px 18px 5px',
// width: 750,
autoHeight : true,
frame : true,
textAlign: 'right',
items:[{
layout: 'column',
items: [
{columnWidth: 0.90,
items: [{
layout: 'form',
items: [{
xtype : 'combo',
store : dsClient,
fieldLabel : 'Client',
anchor : '98%',
name : 'client',
id : 'client',
displayField:'clientFirstName',
valueField:'clientId',
hiddenName: 'clientId',
emptyText : 'Please select a client...',
mode:'remote',
allowBlank : false,
typeAhead: true,
listeners:{
'select' : function(){
Ext.getCmp('sensitivityCombo').setDisabled(false);
Ext.getCmp('sensitivityCombo').getStore().load();
}
}
}]
}]
},{
columnWidth: 0.10,
items: [{
layout: 'form',
items: [{
xtype : 'button',
iconCls: 'icon-add',
text: 'Add Client',
listeners: {
'click': function (){
if (!newClientWindow){
newClientWindow = newClient();
}
newClientWindow.show(this);
}
}
}]
}]
}]
},{
layout: 'column',
items: [{
columnWidth: 0.5,
layout: 'form',
items:{
xtype : 'combo',
store : dsMatterSensitivities,
fieldLabel : 'Sensitivity',
anchor : '95%',
name : 'sensitivityCombo',
id : 'sensitivityCombo',
displayField:'value',
valueField:'key',
hiddenName: 'sensitivity',
emptyText : 'Please select the sensitivity...',
allowBlank : false,
disabled : false,
typeAhead: false,
listeners:{
'select' : function(){
Ext.getCmp('locationCombo').setDisabled(false);
Ext.getCmp('locationCombo').getStore().load();
}
}
}
},{
columnWidth: 0.5,
layout: 'form',
items:{
xtype : 'combo',
store : dsBranches,
fieldLabel : 'Location',
anchor : '95%',
name : 'locationCombo',
id : 'locationCombo',
// triggerAction: 'all',
monitorValid: true,
displayField:'value',
valueField:'key',
hiddenName: 'location',
emptyText : 'Please select the location...',
mode:'remote',
allowBlank : false,
disabled : true,
typeAhead: true,
listeners:{
'select' : function(){
Ext.getCmp('description').setDisabled(false);
Ext.getCmp('counterPartyGrid').setDisabled(false);
Ext.getCmp('clientGrid').setDisabled(false);
Ext.getCmp('billingPlanCombo').setDisabled(false);
Ext.getCmp('billingPlanCombo').getStore().load();
}
}
}
}]
},{
xtype: 'textarea',
id: 'clientDescription',
name: 'clientDescription',
fieldLabel : 'Description',
emptyText: 'Please describe the client...',
anchor : '98%',
disabled: true
},{
layout: 'form',
bodyStyle:'padding:5px 5px 5px 5px',
anchor: '99%',
items: [
clientContactGrid
]
},{
layout: 'form',
bodyStyle:'padding:5px 5px 5px 5px',
anchor: '99%',
items: [
counterPartyGrid
]
},{
xtype:'fieldset',
title: 'Billing Details',
collapsible: false,
autoHeight:true,
autoWidth: true,
defaults: {width: 210},
defaultType: 'textfield',
items :[{
xtype : 'combo',
store : dsBillingTypes,
fieldLabel : 'Category',
anchor : '98%',
name : 'billingPlanCombo',
id : 'billingPlanCombo',
// triggerAction: 'all',
monitorValid: true,
displayField:'value',
valueField:'key',
emptyText : 'Please select a billing plan...',
mode:'remote',
allowBlank : false,
disabled : true,
typeAhead: true
}]
}],
buttons : [{
text : 'Save',
formBind: true,
handler:function(){
var form = Ext.getCmp('matterForm').getForm();
form.submit({
method:'POST',
waitTitle:'Connecting',
waitMsg:'Sending data...',
success:function(){
Ext.Msg.alert('Status', 'Matter Registered!');
form.reset();
form.hide();
},
failure:function(form, action){
if(action.failureType == 'server'){
obj = Ext.util.JSON.decode(action.response.responseText);
Ext.Msg.alert('Register matter failed!', obj.errors.reason);
}else{
Ext.Msg.alert('Warning!', 'Server is unreachable : ' + action.response.responseText);
}
form.reset();
form.hide();
}
});
}
},{
text : 'Reset',
formBind: true,
handler: function(){
Ext.getCmp('matterForm').getForm().reset();
}
},{
text : 'Close',
handler: function(){
window.location = '';
}
}]
});
});


JSON responses


{"totalCount":1,"root":[{"clientId":4,"clientFirstName":"Client First Name","clientLastName":null,"clientDescription":"Client Description","clientReferringParty":null}]}




{"totalCount":2,"root":[{"value":"None","key":"0","description":"None"},{"value":"Confidential","key":"1","description":"Confidential"}]}

desouza.trevor
19 May 2011, 3:15 AM
All i did was changed the JsonStore and put in a JSON reader