Question

在我的JavaScript文件中，我有以下商店变量：

Ext.onReady(function() {
 var store2 = Ext.create('Ext.data.Store', {

 storeId : 'employeeStore',
 fields : [ 'firstname', 'lastname', 'age' ],
 data : [ {
 firstname : "Michael",
 lastname : "Scott",
 age : "7",
 }, {
 firstname : "Caroline",
 lastname : "Schrute",
 age : "2",
 }, {
 firstname : "Jim",
 lastname : "Halpert",
 age : "3"
 }, {
 firstname : "Kevin",
 lastname : "Malone",
 age : "4",
 }, {
 firstname : "Angela",
 lastname : "Martin",
 age : "5",
 } ]
     });

在我的面板中有几行我有几个表单字段：

Ext.create('Ext.form.Panel', {
    title : 'Person Info',
    labelWidth : 75,

    frame : true,
    bodyStyle : 'padding:5px 5px 0',
    width : 900,
    renderTo : Ext.getBody(),
    layout : 'column',
    // arrange fieldsets side by side
    items : [
            {

                // ***** Person Info*****
                // Fieldset in Column 1 - collapsible via toggle button
                xtype : 'fieldset',
                columnWidth : 0.5,
                title : 'Person Details',
                collapsible : true,
                defaultType : 'textfield',
                defaults : {
                    anchor : '100%'
                },
                layout : 'anchor',
                items : [
                        {
                            fieldLabel : 'First Name:',
                            name : 'PersonFirstName'
                        },
                        {
                            fieldLabel : 'Last Name:',
                            name : 'PersonLastname'
                        } 
  (etc...)

在这个面板中我还有一个按钮，假设在点击时将值存储到网格中

{
                text : 'Add Person',
                xtype : 'button',
                // margin: '0 0 0 100',
                formBind : true,
                // only enabled once the form is valid
                disabled : true,
                handler : function() {

                    // write code to add all fields to the grid
                    var form = this.up('form').getForm();
                    var vals = form.getValues();
                    store2.add(vals);
                }

            },


            {
                xtype : 'grid',
                title : 'Family Details',
                store : Ext.data.StoreManager.lookup('employeeStore'),
                columns : [ {
                    text : 'First Name',
                    dataIndex : 'firstname',
                    type : 'string'
                }, {
                    text : 'Last Name',
                    dataIndex : 'lastname',
                    type : 'string'
                }, {
                    text : 'Age',
                    dataIndex : 'age',
                    type : 'string',

                }, ],
                width : 400,
                forceFit : true,
                renderTo : Ext.getBody()
            } ]

当我按下按钮时，我无法看到网格中的值。它只返回一个空行。

Answer 1

您可能必须将代理配置添加到商店并检查一次。有关详情，请参阅sencha here中的此示例并检查您的商店是否装满。

Answer 2

很难说出问题究竟在哪里。我将从以下开始：

从网格中删除所有列并仅保留一列。（例如姓氏）此步骤将检查是否发生了问题，因为将数据映射到状态。
单击按钮时，首先使用虚拟数据，以便查看附加到商店的工作正常。

var objectCollection = new Array（）;

var objectItem = new Object（）;

objectItem.lastname =＆＃34; TestName＆＃34 ;;

objectCollection.push（objectItem）;

store2.loadData（objectCollection）;
此外，我发现您在商店中定义了值，但未使用＆＃39; autoLoad＆＃39;属性。它应该填充为true（＆＃39; autoLoad：true＆＃39;）。

Answer 3

表单字段名称应与网格列数据索引匹配。在我们的案例表格中，人名的字段名是＆＃34;名称：＆＃39; PersonFirstName＆＃39;＆＃34;所以网格列的数据索引Firs名称应为＆＃34; PersonFirstName＆＃34;反之亦然。

使用extjs将表单值添加到网格中

3 个答案: