未显示Ext JS 4复选框

时间:2013-07-29 18:13:19

标签: javascript extjs checkbox

还有其他人遇到过ext js复选框没出现的问题吗?我们已经尝试了一切,甚至下载了架构师软件,它仍然无法显示......任何想法?

我有一种感觉,就像我们缺少的css / include文件一样,但是我已经浏览了整个互联网,但仍然无法找到解决方案。

 {
            xtype: 'checkboxfield',
            anchor: '100%',
            fieldLabel: 'Label2',
            boxLabel: 'Box Label2'
        }

这是小组:

 var manForm = Ext.create('Ext.form.Panel', {
                width: 800,
                style: 'position: relative; left: 20px;',
                renderTo: Ext.getBody(),
                id: 'man_form',
                title: 'Mobile Information',
                waitMsgTarget: true,
                fieldDefaults: {
                    labelAlign: 'right',
                    labelWidth: 85,
                    msgTarget: 'side'
                },
                items: [
                        {                       
                            xtype: 'container',
                           padding: '10px',
                         defaults: { height: 28 },
                            items: [{
                                          xtype: 'hiddenfield',
                                           name: 'id',
                                             id: 'id',
                                    },
                                    {
                                           xtype:'hiddenfield',
                                            name: 'item_id',
                                              id: 'item_id'
                                    },  
                                    {    xtype: 'container', 
                                        layout: 'hbox',  
                                      defaults: { height: 28 },
                                        margin: ' 0 10 0 0',
                                         items: [{
                                                       xtype:'textfield',
                                                  fieldLabel: 'Number',
                                                        name: 'ItemNumber',
                                                          id: 'ItemNumber',
                                                  labelWidth: 45,
                                                       width: 345, 
                                                   },
                                                   {
                                                       xtype:'textfield',
                                                  fieldLabel: 'Name',
                                                        name: 'ItemName',
                                                          id: 'ItemName',
                                                  labelWidth: 70,
                                                       width: 425,                                                  
                                               }] 
                                    },
                                    {
                                           xtype: 'textfield',
                                      fieldLabel: 'Category List',
                                      labelWidth: 140,
                                           width: 700,
                                            name: 'CategoryList',
                                              id: 'CategoryList'
                                    },
                                    {
                                           xtype: 'textfield',
                                      fieldLabel: 'Short Desc For Cat List',
                                            name: 'ShortDescriptionForCategoryList',
                                              id: 'ShortDescriptionForCategoryList',
                                      labelWidth: 140,
                                           width: 600
                                    },
                                    {  xtype: 'container', 
                                      layout: 'hbox',  
                                      margin: ' 0 10 0 0',
                                       items: [{
                                                       xtype: 'textfield',                                        
                                                        name: 'BasePrice',
                                                  fieldLabel: 'Base Price',
                                                          id: 'BasePrice',
                                                  labelWidth: 140,
                                                       width: 270,
                                                       height: 28
                                                },
                                                {
                                                       xtype: 'textfield',                                        
                                                        name: 'RetailPrice',
                                                  fieldLabel: 'Retail Price',
                                                          id: 'RetailPrice',
                                                  labelWidth: 140,
                                                       width: 270,
                                                      height: 28
                                              },{
                xtype: 'checkboxfield',
                anchor: '100%',
                fieldLabel: 'Label2',
                boxLabel: 'Box Label2'
            }


                                              ] 
                                    },
                                    {
                                           xtype: 'textfield',                                        
                                            name: 'ItemImages',
                                      fieldLabel: 'Item Images',
                                              id: 'ItemImages',
                                      labelWidth: 140,
                                           width: 700                                                  
                                    },
                                    {
                                           xtype: 'textfield',                                        
                                            name: 'ItemPrimaryImageUrl',
                                      fieldLabel: 'Primary Image URL',
                                              id: 'ItemPrimaryImageUrl',
                                      labelWidth: 140,
                                           width: 700                                                   
                                    },                                     
                                    {
                                           xtype: 'textfield',                                        
                                            name: 'ItemPrimaryImageAltText',
                                      fieldLabel: 'Primary Image Alt Text',
                                              id: 'ItemPrimaryImageAltText',
                                      labelWidth: 140,
                                           width: 700                                                   
                                    }, 
                                    {
                                           xtype: 'textfield',                                        
                                            name: 'ItemThumbnailUrl',
                                      fieldLabel: 'Thumbnail URL',
                                              id: 'ItemThumbnailUrl',
                                      labelWidth: 140,
                                           width: 700                                                   
                                    }, 
                                    {
                                           xtype: 'textfield',                                        
                                            name: 'ItemThumbnailAltText',
                                      fieldLabel: 'Thumbnail Alt Text',
                                              id: 'ItemThumbnailAltText',
                                      labelWidth: 140,
                                           width: 700                                                   
                                    },                                         
                                    {
                                           xtype: 'button',
                                            text: 'Update',
                                            name: 'new_button',
                                              id: 'new_button',
                                           style: 'margin-left:720px; margin-bottom:5px',
                                         handler: function(event, toolEl, panel){

                                              Ext.Msg.show({
                                                   title:'Update Data',
                                                   msg: 'Are you sure you want to update these settings?',
                                                   buttons: Ext.Msg.YESNO,
                                                   icon: Ext.Msg.QUESTION,
                                                   fn: function(btn){
                                                     if (btn === 'yes'){

                                                       var obj = manForm.getForm().getValues();
                                                       for (var prop in obj) {
                                                         store.getAt(0).set(prop,obj[prop]);                
                                                        //alert(prop + " : " + obj[prop]);
                                                       }

                                                       store.update();
                                                       store.load();
                                                     }
                                                   }
                                              });
                                         }
                                  },
                         ]

                    }],
        });

1 个答案:

答案 0 :(得分:0)

我没有像kevhender那样真正测试你的代码。但它适用于他但不适合你的事实让我觉得你没有extjs用于复选框的图像文件。通常它放在images / form / checkbox.gif中。 请检查您的图像文件夹一次。此外,开发工具(Firebug或chrome dev工具)控制台应该抛出错误,如果是这样的话 - 说“无法在路径blahblah找到文件”或其他东西。