Добавление ссылки для удаления помимо каждого флажка в checkboxgroup

Question

У меня есть окно, в котором я показываю другие поля в дополнение к checkboxgroup. Эти флажки отображаются динамически и заполняются из массива с именем checkboxconfigs. Как я могу получить ссылку для удаления группы флажков.

Мой код, чтобы отобразить флажок группы является

function showassetForm(record,statusname,emptyval,checkList) 
{ 
    checkboxconfigs = []; 
    arrSubTicket = getSubTickets(record.data.Id); 

    for(z=0;z<arrSubTicket.length;z++) 
     { 
      checkboxconfigs.push({ //pushing into array 
      boxLabel:arrSubTicket[z].Name, 
      name:'checklist', 
      inputValue:arrSubTicket[z].Id, 
      relatedTicket:arrSubTicket[z].TicketId 
    }); 
     } 
    var myCheckboxGroup = Ext.create('Ext.form.CheckboxGroup', { 
     columns: 1, 
     vertical: true, 
     items: checkboxconfigs 
    }); 


    myCheckboxGroup.on({    
     change: function(checkboxGroup, newValue) { 
      console.log("Changed...."); 
      formattedValues = []; 

      newValue = newValue.checklist.length === 0 ? [newValue.checklist] : newValue.checklist; 
      console.log("newvals=="+newValue); 
      checkboxGroup.items.each(function(checkbox){ 
       var checkboxValue = checkbox.inputValue, 
        foramttedValue = {}; 

       foramttedValue[checkboxValue] = newValue.indexOf(checkboxValue) !== -1 ? 'on' : 'off'; 

       formattedValues.push(foramttedValue); 
      }); 
     } 

    }); 



     form = Ext.widget('form', { 
      layout: { 
       type: 'vbox', 
       align: 'stretch' 
      }, 
      border: false, 
      bodyPadding: 10, 

      fieldDefaults: { 
       labelAlign: 'top', 
       labelWidth: 100, 
       labelStyle: 'font-weight:bold' 
      }, 
      defaults: { 
       margins: '0 0 10 0' 
      }, 



      items: [{ 
       xtype: 'fieldcontainer', 
       labelStyle: 'font-weight:bold;padding:0', 
       layout: 'vbox', 
       defaultType: 'textfield', 

       fieldDefaults: { 
        labelAlign: 'left' 
       }, 

       items: 
       [ 
       /*{ 
        flex: 1, 
        name: 'Name', 
        fieldLabel: 'Ticket Description', 
        allowBlank: true 
       },*/ 
       { 

        name: 'Hours', 
        fieldLabel: 'Hours', 
        allowBlank: true, 
        value: record.data.Hours 
       }, 

       {  
        flex: 2, 
        xtype:'textarea', 
        name: 'Notes', 
        fieldLabel: 'Ticket Notes', 
        allowBlank: true 
       }, 
       { 
        xtype: 'combo', 
        fieldLabel: 'Status', 
        hiddenName: 'Status', 
        allowBlank: false, 
        name:'Status', 
        store: new Ext.data.SimpleStore({ 
         data: allstatus, 
         fields: ['value', 'text'] 
        }), 
        // valueField: 'value', 
        valueField: 'value', 
        displayField: 'text', 
        triggerAction: 'all', 
        editable: false, 
        // value : record.data.Status 
        value : statusname 
       }, 
       { 
        xtype: 'combo', 
        fieldLabel: 'Priority', 
        hiddenName: 'Priority', 
        allowBlank: false, 
        name:'Priority', 
        store: new Ext.data.SimpleStore({ 
         data: priorities, 
         fields: ['value', 'text'] 
        }), 
        // valueField: 'value', 
        valueField: 'value', 
        displayField: 'text', 
        triggerAction: 'all', 
        editable: false, 
        value : record.data.Priority 
       },      
       { 
        xtype: 'button', 
        //id: 'newSubTicket', 
        cls:'x-btn-default-small', 
        text: '+ Checklist', 
        handler : function() { 
         createSubticket(record,statusname); 
        }, 
        style : 'margin:0 0px' 
       }, 

       myCheckboxGroup 

       ] 
      }], 

      buttons: [{ 
       text: 'Cancel', 

       handler: function() {       
        this.up('form').getForm().reset(); 
        this.up('window').hide(); 
        // checkboxconfigs = []; 
       } 
      }, { 
       text: 'Save', 
       handler: function() { 
         if (this.up('form').getForm().isValid()) 
         { 
         // In a real application, this would submit the form to the configured url 
         // this.up('form').getForm().submit(); 
         form = this.up('form').getForm(); 
         var recordsToAdd = [],recordsToAddNotes = []; 
         var record1 = {},recordNotes = {}; 
         //this.up('window').hide(); 
         //var summary = form.findField('Name').getSubmitValue(); 
         var hrs = form.findField('Hours').getSubmitValue(); 
         var status = form.findField('Status').getSubmitValue(); 
         var priority = form.findField('Priority').getSubmitValue(); 
         var notes = form.findField('Notes').getSubmitValue(); 
         //record1['dev_summary'] = summary; 
         //record1['dev_total_hours'] = hrs; 
         record1['ccfive_related_ticket_status']=status; 
         record1['dev_priority']=priority; 
         record1['io_uuid'] = record.data.Id; 
         //console.log("TicketName="+record.data.TicketName); 
         recordsToAdd.push(record1); 

         recordNotes['dev_note'] = notes; 
         recordNotes['dev_hours'] = hrs; 
         recordNotes['dev_related_punchlist_item'] = record.data.Id; 
         recordNotes['ccfive_related_ticket_status'] = status; 
         recordsToAddNotes.push(recordNotes); 
         /* Ext.Ajax.request({ 
         url: '/api/rest/v1/dev_ticket', 
         method: "PUT", 
         jsonData: JSON.stringify(recordsToAdd), 
         success: function(response, opts) { 
          //record.setName(summary); 
          //record.setHours(hrs); 
          //record.setHours(hrs); 
          console.log(record); 
          //alert("Ticket updated sucessfully") 
          //win.hide(); 
         }, 
         failure: function(response, opts) { 
          console.log('server-side failure with status code ' + response.status); 
         } 
         }); 

         Ext.Ajax.request({ 
         url: '/api/rest/v1/dev_ticket_note', 
         method: "POST", 
         jsonData: JSON.stringify(recordsToAddNotes), 
         success: function(response, opts) { 
          console.log(record); 
          alert("Ticket updated sucessfully") 
          win.hide(); 
         }, 
         failure: function(response, opts) { 
          console.log('server-side failure with status code ' + response.status); 
         } 
         }); 
         console.log(Ext.encode(formattedValues)); 
         updateStatus(formattedValues);*/ 
         console.log("checkboxes.........."); 
         console.log(checkboxconfigs); 
         newSubtickets(checkboxconfigs); 
        } 
       } 
      }] 
     }); 

     win = Ext.widget('window', { 
      title: record.data.TicketName, 
      closeAction: 'hide', 
      width: 400, 
      height: 450, 
      minHeight: 220, 
      layout: 'fit', 
      resizable: true, 
      modal: true, 
      items: form 
     }); 
     win.show(); 

}

Мое окно выглядит как на картинке ниже мне нужна ссылка, кроме каждого чекбокса, чтобы удалить их.

Answer 1

вы можете прикрепить myCheckboxGroup к окну

win = Ext.widget('window', { 
    title: record.data.TicketName, 
    closeAction: 'hide', 
    width: 400, 
    height: 450, 
    myCheckBoxes:myCheckboxGroup, 
    minHeight: 220, 
    layout: 'fit', 
    resizable: true, 
    modal: true, 
    items: form 
}); 
win.show(); 

и вы можете получить доступ к этой группе по wnd.myCheckBoxes. удалить wnd.down ("form"). Remove (wnd.myCheckBoxes); Я правильно понял вашу проблему?