加载商店数据以动态构建表单 煎茶触摸2.
Loading store data to build a form dynamically Sencha Touch2
我想建立一个调查,从数据库中加载问题。问题的数量各不相同,所以我正在动态构建一个表单。我认为使用 store.each 和里面的 form.add 会起作用,但 store.data.length 返回 0 即使数据已加载。
控制台.log(商店)返回:
Ext.apply.create.Class {[...]
data: Ext.apply.create.Class
[...]
all: Array[3]
raw: Object
0:
name: "textfield1"
title: "label1"
xtype: "textfield"
1: [...]
2: [...]
[...]
length: 3 [...]
因此,数据已加载。但下一行是console.log('q:',question.data.all.length);并返回:
number of q: 0
我不知道为什么返回 0 条记录,并且从不运行 store.each。我附上所有相关文件。
型:
Ext.define("LabApp.model.Survey", {
extend : "Ext.data.Model",
config : {
idProperty : 'id',
fields : [
{ name : 'id', type : 'int' },
{ name : 'xtype', type : 'string' },
{ name : 'title', type : 'string'},
{ name : 'name', type : 'string'}
]
}
});
商店:
Ext.define('LabApp.store.Survey', {
extend : 'Ext.data.Store',
requires : "Ext.data.proxy.Ajax",
config : {
model : 'LabApp.model.Survey',
autoLoad : false,
proxy : {
type : 'ajax',
url : '/LabApp/server/surveys.php',
reader : {
type : 'json',
rootProperty : 'data'
},
},
sorters : [ {
property : 'id',
direction : 'ASC'
} ],
}
});
杰森:
{
success: true,
data: [
{xtype: 'textfield', title: 'label1', name: 'textfield1'},
{xtype: 'textfield', title: 'label2', name: 'textfield2'},
{xtype: 'textfield', title: 'label3', name: 'textfield3'}
]
}
视图:
Ext.define('LabApp.view.Survey', {
extend : 'Ext.form.Panel',
alias : 'widget.surveyView',
requires : [ 'Ext.form.FieldSet', 'Ext.Button' ],
config : {
title : 'Survey',
layout : {
type : 'vbox',
},
items : [
{
xtype : 'fieldset',
margin : '0 10 5 10',
items : []
} ]
}
});
控制器:
Ext.define('LabApp.controller.Survey', {
extend : 'Ext.app.Controller',
config : {
refs : {
mainView : 'mainView',
surveyView : 'surveyView'
}
},
launch : function() {
var question = Ext.getStore('Survey');
question.load();
var form = this.getSurveyView();
var fieldset = form.down('fieldset');
console.log(question);
console.log(question.getData());
question.each(function(record, idx) {
console.log(record.get('title'));
form.add(record);
});
form.doLayout();
}
});
知道那里发生了什么吗?更好的方法?
我认为问题是您需要在存储加载处理程序中包含form.add()代码。在代码现在的位置,您无法保证商店此时已加载。通过使用存储加载事件,这将在存储完成加载新记录后触发,并且传递到事件中的参数之一是记录集本身,因此您可以循环访问这些记录。
相关文章:
- 可以't让我的if语句处理js中的html表单输入
- 如何使用WCF服务和javascript表单post上传.doc文件
- Javascript生成的表单未提交
- 如何使用javascript或html下载PDF格式的填写表单
- HTML表单提交时未执行外部函数
- 如何将输入(type=text)从html表单传递到javascript函数
- 通过单击表单中的按钮,在代码生成中使用javascript生成字母数字代码
- Ajax发布表单序列化,发布引号'
- 多级HTML表单
- 后焦点更改为IE 11中的地址栏,而不是转移到表单中的下一个控件
- 在验证和发送邮件后更改联系人表单的 html
- jQuery表单添加不适用于下拉列表
- Rails/JSON:如何将JSON用于jquery UI自动完成表单
- 加载商店数据以动态构建表单 煎茶触摸2.
- 触摸启动时显示为灰色的表单按钮
- 是否有可接受的跨平台方法在基于触摸的设备上以标准 Web 表单显示数字键盘
- Sencha触摸表单面板,不使用鼠标滚动
- Sencha触摸动态构建表单面板
- html表单输入不能在触摸设备上工作
- 不能使用iPhone触摸html表单