How to load data to a form

[henrymuro]

I am a newbie learning Sencha Touch so please bear with me. I searched through the fourms for the answer and can not figure out this simple task. I am simply trying to load data into a form and am stuck. Here is the simple code I am using







Ext.setup({




onReady: function() {

var projectModel = Ext.regModel('projModel', {
fields: ['project_id',
'project_name',
'division',
'business_unit'
]
});


var projectStore = new Ext.data.JsonStore({
model : 'projModel',
storeId: 'projStore',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'project.json',

reader: {
type: 'json'
}
}

});



var basicSection = {
xtype: 'fieldset',
title: 'Basics',
defaults: {
xtype: 'textfield',
listeners: {
afterrender: function(ele) {
//ele.fieldEl.dom.readOnly = true;
}
}
},
items: [
{
label: 'Project ID',
name: 'project_id'
},
{
label: 'Project Name',
name: 'project_name'
},
]

};

var classificationSection = {
xtype: 'fieldset',
title: 'Classification',
defaults: {
xtype: 'textfield'
},
items: [
{
label: 'Division1',
name: 'division1'
},
{
label: 'Business Unit',
name: 'business_unit'
},
]

};

var ProjectForm = new Ext.form.FormPanel({
fullscreen: true,
id: 'projform',
dockedItems:[
{
xtype: 'toolbar',
dock: 'top',
title: 'Project 1',
}
],
items: [
{
label: 'Division',
name: 'division'
},
basicSection,
classificationSection
]
});

var record = projectStore.getAt(0);
ProjectForm.loadRecord(record);





}
});


My project.json code looks like this

[
{
"project_id": "1211",
"project_name": "My test Project",
"division": "Divison 1",
"business_unit": "Business Unit 2"
}
]

[mitchellsimoens]

As long as the name of the form field matches the name of the field in the record then loadRecord will put the data into the form.

[henrymuro]

Thanks for the reply. The name of the form fields do match the fields of the record. In my example I removed divison1 which I added to test. I did use loadRecord but when the form loads the data is not loaded. Any ideas?


Ext.setup({
glossOnIcon: false,
onReady: function() {

var projectModel = Ext.regModel('projModel', {
fields: ['project_id',
'project_name',
'division',
'business_unit'
]
});
var projectStore = new Ext.data.JsonStore({
model : 'projModel',
storeId: 'projStore',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'project2.json',

reader: {
type: 'json'
}
}

});

var basicSection = {
xtype: 'fieldset',
title: 'Basics',
defaults: {
xtype: 'textfield',
listeners: {
afterrender: function(ele) {
//ele.fieldEl.dom.readOnly = true;
}
}
},
items: [
{
label: 'Project ID',
name: 'project_id'
},
{
label: 'Project Name',
name: 'project_name'
},
]

};

var classificationSection = {
xtype: 'fieldset',
title: 'Classification',
defaults: {
xtype: 'textfield'
},
items: [
{
label: 'Division1',
name: 'division'
},
{
label: 'Business Unit',
name: 'business_unit'
},
]

};

var ProjectForm = new Ext.form.FormPanel({
fullscreen: true,
id: 'projform',
dockedItems:[
{
xtype: 'toolbar',
dock: 'top',
title: 'Project 1',
}
],
items: [
basicSection,
classificationSection
]
});

var record = projectStore.getAt(0);
ProjectForm.loadRecord(record);


}
});