如何将输入值插入store on按钮单击extjs

我正在用extjs实现这个项目。我想在单击“确定”按钮时将文本字段值插入存储。我把表单设计成-

模型-

Ext.define('AM.model.User', {
    extend: 'Ext.data.Model',
    fields: ['Question', 'Option']
});

贮藏-

Ext.create('Ext.data.Store', {
    model: 'User',
    proxy: {
               type: 'localstorage',
           }
    autoLoad: true
});

控制器-

Ext.define('AM.controller.Users', {
     extend: 'Ext.app.Controller',
     views: [
                'user.List',
            ],
     store: ['Users'],
     model: ['User'],
     init: function() {
        this.control({
            "button": {
                click: this.onButtonClick
            }
        });
      },    
      onButtonClick: function(button){
      var form = button.up('form').getForm ();

      // Validate the form
      if (form.isValid ()) {
        var values = form.getFieldValues ();
        store.add ({
          Question: values.Question,
          Option: values.Option
        });
      }
      else {
          alert("Insert values in textfields");       
      } 
    }
    });

看法-

---

但当我在控制器代码中添加上面的onbuttonclick操作时，它不会显示任何输入字段。所以，有人能帮我显示视图并将这些输入插入存储吗

由于以下原因，我浏览了上面的代码片段。
1）Json语法错误。
2）您把Ext.define和Ext.Create搞糟了

我已经更新了你的脚本，并在我的本地机器上进行了测试。它起作用了

//控制器-应用程序/控制器

 Ext.define('AM.controller.Users', {
        extend: 'Ext.app.Controller',

         views: [
                    'user.List'
                ],
         stores: ['Users'],
         models: ['User'],
        init: function() {
            console.log('controller initialized');
            this.control({
                'viewport panel button': {
                    'click': this.onButtonClick
                }
            });
        },

        onButtonClick: function(button, e, eOpts ) {
            var form = button.up('form').getForm();
            var model = this.getModel('AM.model.User');

          // Validate the form
          if (form.isValid ()) {
            var question = model.create(form.getFieldValues());
            console.log(question.data);
          }
          else {
              alert("Insert values in textfields");       
          } 
        }

    },function(){
        console.log("Users Controller created");
    });

//视图-应用程序/视图/用户/列表

 Ext.define('AM.view.user.List', {
        extend: 'Ext.form.Panel',
        alias: 'widget.userlist',
        title: 'Question-option',
        width: 300,
        bodyPadding: 10,
        renderTo: Ext.getBody(),        
         url: 'some url',// in case of ajax
        //  initComponent: function(){
        items: [{
            xtype: 'textfield',
            name: 'Question',
            fieldLabel: 'Question',
            allowBlank: false  // requires a non-empty value
        }, {
            xtype: 'textfield',
            name: 'Option',
            fieldLabel: 'Option'
            vtype: 'email'  // requires value to be a valid email address format
        },
        {
        xtype:'button',
        text:'Save'

       }
        ]

    },function(){
    console.log("List view was created");
    });

---

更新你的JS文件并运行！如果您遇到任何问题，请在此处发表评论

这有帮助吗？请查看您之前的问题，并单击空心复选标记将最佳答案标记为已接受。谢谢你，谢谢你的帮助。但链接“jsfiddle.net/dbrin/wULET/3”中给出的示例具有带有某种静态值的存储。我想将视图表单的问题和选项的文本字段值插入存储，并在gridview中显示该存储。所以，请告诉我如何将文本字段输入插入存储。我正在将store与localstoragproxy一起使用。我的项目代码如上所述…Thanx为您提供帮助巴顿先生。但当我更换控制器并按照巴顿先生给出的代码完全查看文件时，它不会显示任何视图。在cosole窗口中，输出显示为-列表视图已创建列表。js:28用户控制器已创建用户。js:33控制器已初始化，但没有显示任何输入字段。Hmmm您能将您的外部应用程序代码和视口一起显示给我吗？

 Ext.define('AM.view.user.List', {
        extend: 'Ext.form.Panel',
        alias: 'widget.userlist',
        title: 'Question-option',
        width: 300,
        bodyPadding: 10,
        renderTo: Ext.getBody(),        
         url: 'some url',// in case of ajax
        //  initComponent: function(){
        items: [{
            xtype: 'textfield',
            name: 'Question',
            fieldLabel: 'Question',
            allowBlank: false  // requires a non-empty value
        }, {
            xtype: 'textfield',
            name: 'Option',
            fieldLabel: 'Option'
            vtype: 'email'  // requires value to be a valid email address format
        },
        {
        xtype:'button',
        text:'Save'

       }
        ]

    },function(){
    console.log("List view was created");
    });