Динамическое добавление полей в форме
В очередной раз всех приветствую. У меня проблемка. Мне нужно что б в моей формочке, поля для ввода появлялись динамически, при нажатии на кнопочку рядом, в этой же форме. Форму я сделал, кнопочку тоже, поля тоже. Поля для ввода я передаю как массив объектов. Нужно чтобы по нажатию на кнопочку появлялись новые поля... Но они не появляются, и в дереве ДОМа тоже... что посоветуете?
Идея была такая, что бы по нажатию, в массив, вносился очередной объект, содержащий сведения о полях и прочем. В общем вот код, handler кнопочки начинается со 108 строки. Сорри за большой размер...
function formDisk() {
// var NUM = 1;
// function num(n){
// n = n + 0;
var el_form = new Array();
// for(var i=0;i<n;i++){
el_form[0] = {
xtype : 'fieldset',
title : 'Файл',
collapsible : true,
autoHeight :true,
defaults : {width: 210},
defaultType : 'textfield',
items :[
{
fieldLabel : 'Имя',
allowBlank : false,
name : 'NAME'
},
{
xtype : 'combo',
store : getStore('type_file'),
mode : 'local',
valueField : 'name',
displayField : 'name',
triggerAction : 'all',
// allowBlank : true,
fieldLabel : 'Тип диска',
allowBlank : false,
name : 'TYPE'
},
{
fieldLabel : 'Примечение',
name : 'ABOUT'
}
]
}
// }
// return el_form;
// }
var form = new Ext.FormPanel({
url : 'index.php?ajax=yes&query=insert&action=disk',
header : false,
title : 'Диск(добавить)',
// width : 500,
labelWidth : 120,
frame : true,
defaults : { width: 360 },
defaultType : 'textfield',
items:[
{
xtype : 'fieldset',
title : 'Характеристики диска',
collapsible : true,
autoHeight :true,
defaults : {width: 210},
defaultType : 'textfield',
items :[
{
fieldLabel : 'Имя',
allowBlank : false,
name : 'NAME'
},
{
xtype : 'combo',
store : getStore('type_disk'),
mode : 'local',
valueField : 'name',
displayField : 'name',
triggerAction : 'all',
// allowBlank : true,
fieldLabel : 'Тип диска',
allowBlank : false,
name : 'TYPE'
},
{
border : true,
xtype : 'combo',
store : getStore('group_disk'),
mode : 'local',
valueField : 'name_group',
displayField : 'name_group',
triggerAction : 'all',
fieldLabel : 'Группа диска',
allowBlank : false,
name : 'GROUP'
},
{
fieldLabel : 'Примечение',
name : 'ABOUT'
}
// ,
// {
// id : 'num_files',
// fieldLabel : 'Количество файлов',
// name : 'NUM_FILES',
// value : 3
// }
]
},
el_form,
// num(NUM),
{
xtype : 'button',
text : 'Еще файл',
width : 100,
handler : function(){
el_form[el_form.length] = {
xtype : 'fieldset',
title : 'Файл' + el_form.length,
collapsible : true,
autoHeight : true,
defaults : {width: 210},
defaultType : 'textfield',
items :[
{
fieldLabel : 'Имя',
allowBlank : false,
name : 'NAME' + el_form.length
},
{
xtype : 'combo',
store : getStore('type_file'),
mode : 'local',
valueField : 'name',
displayField : 'name',
triggerAction : 'all',
// allowBlank : true,
fieldLabel : 'Тип диска',
allowBlank : false,
name : 'TYPE' + el_form.length
},
{
fieldLabel : 'Примечение',
name : 'ABOUT' + el_form.length
}
]
}
form.show();
}
}
],
buttons: [
{
text: 'Reset',
handler: function(){
form.getForm().reset();
}
},{
text : 'Добавить',
handler: function() {
form.getForm().submit({
success: function(f,a){
// url: 'index.php?ajax=yes&action=adduser',
Ext.Msg.alert('Success', 'It worked');
},
failure: function(f,a){
// Ext.Msg.alert('Warning', 'Error');
if (a.failureType === Ext.form.Action.CONNECT_FAILURE){
Ext.Msg.alert('Failure', 'Server reported:'+a.response.status+' '+a.response.statusText);
}
if (a.failureType === Ext.form.Action.SERVER_INVALID){
Ext.Msg.alert('Warning', a.result.errormsg);
}
}
})
}
}]
});
// Ext.Msg.alert('info', Number(Ext.getCmp('num_files').value));
return form;
}
|
буду краток,
var valField = new Ext.form.NumberField({
fieldLabel: attribute.name,
name: 'val',
id: 'attribute-val'
});
form.add(valField);
, где form это Ext.form.FormPanel |
И если добавляете после того как форма отрендерина, не за будьте doLayout() вызвать.
|
А если надо вставить перед каким то компонентом то как добавлять?
|
Цитата:
|
Ребят. Спасибо вам большое. В очередной раз мне помогаете.
|
А если на форме есть сварачивающиеся компоненты, и при сворачивании остается окно с формой уменьшается, остается тень, пока не передвинешь окно, то как перерисовать окно? или что можно еще сделать?
|
cmygeHm,
doLayout() должно помочь, но проблема мне не извесна |
я пробывал doLayout(), не помогогло.
Вот нашел http://shitmores.blogspot.com/2008/0...to-resize.html Помогло :) |
Запустил пример автора топика. Все работает, поля добавляются. А как отсабмитить такую форму? Ведь в JsonReader жестко прописываются поля. И массив задать там вроде как нельзя.
Хотелось бы получить примерно такой json, (на примере автора темы)
files:[{name:"фото.jpg",type:"jpg",about:"bla bla bla"},
{name:"фото2.jpg",type:"jpg",about:"bla bla bla"},
{name:"фото3.jpg",type:"jpg",about:"bla bla bla"}]
|
| Часовой пояс GMT +3, время: 01:14. |