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（＆＃34; form＆＃34;）。remove（wnd.myCheckBoxes）; 我是否正确理解了您的问题？

添加链接以删除复选框组中的每个复选框

1 个答案: