ExtJS - представить выбранные значения флажка в строке

Question

У меня есть компонент флажок группы и каждое значение флажка После отправки формы передаются как отдельный параметр, как так:

mycheckboxgroup: val1 
mycheckboxgroup:val2 
mycheckboxgroup:val3 

Как я могу вместо этого представить все значения флажка группы в разделенной запятой строке?

mycheckboxgroup: val1, val2, val3 

Я попытался с помощью метода getSubmitData, но это не сработало. Значения по-прежнему представлены в отдельных параметрах.

Вот отрывок из моего класса CheckBoxGroup:

Ext.define("MyApp.view.form.field.CheckboxGroup",{ 
    extend:"Ext.form.CheckboxGroup", 

    vertical:true, 
    columns:2, 
    getSubmitData:function(){ 
     var fldNm = this.name; 
     return this.getValue()[fldNm].toString(); 
    }, 

    initComponent:function(){ 
    ..... 
    ..... 

    this.callParent(arguments); 
    } 

}); 

Я использую Ext 6.0.2

Благодарности

Answer 1

Проблема заключается в том, что ваша форма, по представлению, будет запрашивать флажков , а не группы в целом.

Однако вы можете создать настраиваемый компонент с непостоянными флажками и скрытое поле, которое агрегирует значение. Это может понадобиться тонкая настройка, но что-то вроде этого:

Ext.define("MyApp.ux.CheckboxGroup",{ 
    extend:"Ext.form.CheckboxGroup", 
    xtype:'mycheckboxgroup', 
    initComponent:function() { 
     var me = this, 
      hf = Ext.widget({xtype:'hiddenfield',name:me.name}); 
     me.callParent(arguments); 
     var checkboxes = me.query('checkbox'), 
      onChange = function(cb, nv) { 
       var arr = []; 
       Ext.each(checkboxes,function(item) { 
        if(item.checked) arr.push(item.inputValue); 
       }); 
       hf.setValue(arr.join(', ')); 
      }; 
     Ext.each(checkboxes, function(item) { 
      console.log(item); 
      item.on('change',onChange); 
      item.submitValue = false; // do not submit the checkbox value 
     }) 
     me.add(hf); 
    } 
}); 

Соответствующей скрипки: https://fiddle.sencha.com/#view/editor&fiddle/1mim