PDA

View Full Version : loadData and DateField problem - nevermind



dougd_unc
27 Jun 2011, 1:03 PM
Nevermind... I just realized I had the wrong dataIndex in my grid.


Hello,

I'm using version 3.2.1. I have a grid and an ArrayStore set up. For some reason when I do a loadData on some json encoded data, all the fields show up in the grid except for the date field. How can I correct this? Please see ArrayStore and loadData below. Thanks.




//data store for the grid
var store = new Ext.data.ArrayStore({
id: 'menteeStore',
fields: [
{name: 'first_name', type: 'string'},
{name: 'last_name', type: 'string'},
{name: 'email', type: 'string'},
{name: 'cohort', type: 'string'},
{name: 'expire_date', type: 'date', dateFormat: 'm/d/Y'}
]

});

store.loadData([["Joe","Smith","[email protected]","Class of 2012","11\/11\/2012"]]);

Ext.onReady(function(){

Ext.QuickTips.init();
Ext.QuickTips.getQuickTip().interceptTitles = true;

Ext.form.Field.prototype.msgTarget = 'side';
// default template structure for combobox hover messages
var tplstr = '<tpl for="."><div ext:qtip="{description}" class="ux-mselect-item ';
if(Ext.isIE || Ext.isIE7){
tplstr = tplstr + '" unselectable=on>{name}</div></tpl>';
}
else{
tplstr = tplstr + ' x-unselectable">{name}</div></tpl>';
}

// Generic function to build the grid
function getGrid(){

if(Ext.getCmp('grid')){
gridPanel.removeAll();
}

var name_editor = new Ext.form.TextField({
allowBlank: false,
/* mode: 'local', */
triggerAction: 'all'});

// TODO: use email regexp
var email_editor = new Ext.form.TextField({
allowBlank: false,
vtype: 'email',
vtypeText: 'Please enter a valid email address' });

var cohort_editor = new Ext.form.TextField({
allowBlank: true,
/* mode: 'local', */
triggerAction: 'all'});

var date_editor = new Ext.form.DateField({
allowBlank: true,
xtype: 'datefield',
format: 'd/m/Y'});


//store.load();


// columns in grid
var tblColumns = [
{header: "First Name", width: 150, sortable: false, dataIndex: 'first_name', editor: name_editor },
{header: "Last Name", width: 150, sortable: false, dataIndex: 'last_name', editor: name_editor },
{header: "Email", width: 200, sortable: false, dataIndex: 'email', editor: email_editor },
{header: "Cohort", width: 100, sortable: false, dataIndex: 'cohort', allowBlank: true, editor: cohort_editor },
{header: "Date", width: 100, sortable: false, dataIndex: 'date', allowBlank: true, editor: date_editor, renderer: Ext.util.Format.dateRenderer('m/d/Y') }
];

// grid of associations
var grid = new Ext.grid.EditorGridPanel({
id:'student_grid',
store: store,
columns: tblColumns,
height: 250,
stripeRows: true,
anchor: '100% 100%',
loadMask: false,
bbar:[
{
text: 'Add Student To List',
iconCls: 'add',
handler: function(){
var u = new grid.store.recordType({
first_name: '',
last_name: '',
email: ''
});
grid.stopEditing();
grid.store.add(u);
grid.startEditing(grid.store.getCount()-1, 0);
}
},

{
text: 'Remove Student From List',
iconCls: 'destroy',
handler: function(){
var sm=grid.getSelectionModel();
var sel=sm.getSelectedCell();
if (sel != null) {
var index=sel[0];
data = grid.store.getAt(index);
grid.store.removeAt(index);
}
}
},

{
text: 'Invite Everyone in List',
iconCls: 'save',
handler: function(){

var gridData = new Array();
store.each(function (record) {
gridData.push(record.data);
});

$('invite_grid_data').value = Ext.encode(gridData);
$('em_invite_mentor').onsubmit();
}
}
]
});


var students = new Ext.form.FormPanel({
formId : 'student_editor_form',
id : 'student_editor',
plain : true,
border : true,
anchor : '100%',
applyTo : 'table_content',
items : [grid]

});

//grid.relayEvents(grid.store,['update','destroy','save']); // ?????????????
}

getGrid();

});