如何制作动态表格
Posted
技术标签:
【中文标题】如何制作动态表格【英文标题】：how to make dynamic forms 【发布时间】：2012-11-27 07:46:45 【问题描述】：我想保存数据（结果），但要保存三个同名字段。当一个被启用时，其他人被禁用。这个对我有用。但问题是，当我从网格中编辑它时，添加了两个值...... [in extjs 4 mvc]
这是我的看法
Ext.define('Ext4Example.view.employee.Education' ,
extend: 'Ext.window.Window',
alias : 'widget.education',
modal:true,
autoShow: true,
bodyPadding: 5,
initComponent: function ()
this.items = [
xtype: 'form',
id:'form',
bodyStyle:
background: 'none',
padding: '10px',
border: '0'
,
items: [
xtype: 'fieldcontainer',
items: [
xtype: 'combobox',
fieldLabel: 'Result Type',
emptyText:'Select Result Type',
displayField:'type',
valueField:'id',
store: 'TypeStocks',
name: 'type',
id:'type',
width: 265,
allowBlank:false,
anchor:'95%',
listeners :
'select':
fn: function (combo, value)
var value=combo.getValue();
if(value =='1')
Ext.getCmp('cgpa').hide();
Ext.getCmp('jak').hide();
Ext.getCmp('sc').hide();
Ext.getCmp('range').hide();
Ext.getCmp('range').disable();
Ext.getCmp('cgpa').disable();
Ext.getCmp('division').enable();
Ext.getCmp('division').show();
else if(value =='2')
Ext.getCmp('division').disable();
Ext.getCmp('division').hide();
Ext.getCmp('cgpa').enable();
Ext.getCmp('cgpa').show();
Ext.getCmp('jak').show();
Ext.getCmp('sc').show();
Ext.getCmp('range').enable();
Ext.getCmp('range').show();
,
xtype:'combobox',
fieldLabel: 'Division',
name: 'result',
emptyText:'Select Result',
store: Division,
id:'division',
width: 265,
anchor:'95%',
allowBlank:false
,
xtype:'fieldcontainer',
layout: 'hbox',
items:[
xtype:'label',
text:'Score',
hidden: true,
id:'sc'
,
xtype:'textfield',
name: 'result',
hidden: true,
width: 68,
margin:'0 0 0 75',
id:'cgpa',
anchor:'95%',
emptyText:'Score',
vtype : 'radius',
allowBlank:false
,
xtype:'textfield',
name: 'result',
hidden: true,
width: 68,
margin:'0 0 0 75',
id:'gpa',
anchor:'95%',
emptyText:'Score',
vtype : 'radiuss',
allowBlank:false
,
xtype:'label',
text:'of',
hidden: true,
margin:'0 5 0 5',
id:'jak'
,
xtype: 'combobox',
emptyText:'Range',
store: range,
name: 'range',
id: 'range',
margin:'0 5 0 5',
width: 65,
hidden: true,
anchor:'95%',
allowBlank:false,
listeners :
'select':
fn: function (combo, value)
var value=combo.getValue();
if(value =='5.00')
Ext.getCmp('outOf').setValue(1);
Ext.getCmp('cgpa').enable();
Ext.getCmp('cgpa').show();
Ext.getCmp('gpa').setValue('');
Ext.getCmp('gpa').disable();
Ext.getCmp('gpa').hide();
else if(value =='4.00')
Ext.getCmp('outOf').setValue(0);
Ext.getCmp('gpa').enable();
Ext.getCmp('gpa').show();
Ext.getCmp('cgpa').setValue('');
Ext.getCmp('cgpa').disable();
Ext.getCmp('cgpa').hide();
]
,
xtype: 'button',
text: 'SAVE',
iconCls: 'savee',
handler: function ()
var form = this.up('form').getForm(),
values = form.getValues();
var education = Ext.create('Ext4Example.model.EducationModel',values);
// if (form.isValid())
education.save(
success: function(education)
var store = Ext.data.StoreManager.get('EducationStocks');
store = !store ? Ext.create("EducationStocks") : store;
store.load();
,
failure: function(education)
Ext.Msg.alert('Failed', 'Data already exits');
);
//
,
xtype: 'button',
text: 'Cancel',
margin:'0 0 0 5',
scope: this,
handler: this.close
]
]
];
this.callParent(arguments);
);
---------------
型号
Ext.define('Ext4Example.model.EducationModel',
extend: 'Ext.data.Model',
idProperty: 'id',
fields: [
name: 'result', mapping:'result', type: 'string' ,
name: 'outOf', mapping:'outOf', type: 'int'
],
proxy:
type: 'ajax',
noCache: false,
api:
create : '$createLink(controller:'education', action: 'create')'
,
actionMethods:
create : 'POST'
,
reader:
type: 'json',
root: 'data',
totalProperty : 'total',
successProperty : 'success',
messageProperty : 'message',
implicitIncludes: true
,
writer:
type: 'json',
root: 'data',
writeAllFields: true
,
simpleSortMode: true
,
belongsTo: [model:'Ext4Example.model.ExamModel', name:'exams']
);
【问题讨论】：
问题不清楚。 “我从网格编辑它，两个，添加值............ [在 extjs 4 mvc 中]”是什么意思？ 好吧，当我在表单中添加相应的值时，我会将其显示到网格中。通过双击网格的行，我打开一个新窗口来编辑这些条目。编辑后，我找到相应的网格单元格，其中包含额外的两个逗号（，，）。 【参考方案1】：如果多个字段中的两个同名，则在提交表单时，将同名的字段组合成一个数组，然后提交。因此，如果您检查提交给服务器的参数，它们将是：
type : typeValue
result : [resultFromCombo, resultFromTextField1, resultFromTextField2]
range : rangeValue
所以在服务器中，我认为您是直接将结果数组转换为字符串并保存。在将结果数组转换为字符串时，它将转换为resultFromCombo, resultFromTextField1, resultFromTextField2。因此，您在网格中得到了 2 个逗号。
【讨论】：
如果不是这样，请发布解决方案。帮助社区。span>以上是关于如何制作动态表格的主要内容，如果未能解决你的问题，请参考以下文章