Javascript 水平放置组件时，EXT JS无法看到fieldLabel属性

我正在编写一个extjs应用程序，它包含两个组合框，每个组合框都有自己的

fieldLabel

属性。我想将这些组合框水平放置在彼此相邻的位置。但是，当我尝试执行此操作时，

fieldLabel

不再显示

以下是相关代码：

    var stationsPanel = new Ext.Panel({
        padding: 10,
        id: windowId + "stationsPanel",
         defaultType: "combo",
         width : "100%",
         layout: "hbox",
         items: [{
             fieldLabel: "Start Station",
             id: "startstation",
             allowBlank: false
         },{
             xtype: "spacer",
             width: 50
         },{
             fieldLabel: "End Station",
             id: "endstation",
             allowBlank: false
         }]
     });

通过阅读，我了解到

面板

容器不支持显示

字段标签

属性。因此，我尝试使用EXT示例（表3）以不同的方式呈现我的组件。这显示了

字段标签

值，但组件仍然垂直渲染。我也尝试过这个建议，但这两种解决方案都不适合我

---

鉴于这个问题后面的第一条评论中使用了EXT JS 5.0.1，我想澄清一下我使用的是EXT JS 3.4.0。

fieldLabel仅为表单面板显示。尝试使用表单面板布局hbox

您可以像我在上面提供的示例链接中看到的那样进行尝试

var stationsPanel = new Ext.Panel({
  bodyStyle:'padding:5px 5px 0',
  frame:true,
  id: "stationsPanel",
  layout:'column',
  width : 700,
  items: [{
     layout:'form',
     items:[{
         xtype:'combo',
         fieldLabel: "Start Station",
          id: "startstation",
         allowBlank: false 
     }]
   },{
      layout:'form',
      style: {marginLeft:'50px'},
      items:[{
        xtype:'combo',
        fieldLabel: "End Station",
        id: "endstation",
        allowBlank: false 
      }]
    }]
 });

我没有将

windowId

用于测试 这是经过测试的，按照规则，这是可行的。您可以在处看到结果，也可以在或处看到代码

---

希望这能帮助您

无需垫片，边际性能为您做好工作：

var stationsPanel = new Ext.Panel({
    width: 600,
    layout: {
        type: 'hbox',
        align: 'middle',
        pack: 'center'
    },
    items: [
            {
                 xtype: 'combobox',
                 flex: 1,
                 margin: 20,
                 fieldLabel: 'Start Station',
                 allowBlank: false
            },
            {
                 xtype: 'combobox',
                 flex: 1,
                 margin: 20,
                 fieldLabel: 'End Station',
                 allowBlank: false
            }]
     });

---

简单的蛋糕；）

作品：我应该澄清我使用的是Ext3.4.0。我用这个版本运行了你的小提琴，但它不起作用。很抱歉没提那件事。更新了我的帖子。如果使用Firebug，你会发现任何错误吗？这在大多数情况下都有效，但是组合框之间不再有空格，即使

间隔符仍然存在。我尝试添加边距，但这导致组件不再彼此对齐。
组合框
组件之间没有任何空间的问题现在可以在每个非间隔项之前添加设置为0.5的
columnWidth
属性。因此，我删除了包含
间隔符的第二项。答案已针对组合框之间的空格进行了修改，请检查。执行此操作时，我根本看不到
组合框
组件或
字段标签
值。在任何情况下，
xtype
值应该是'combo'而不是'combobox'“combobox”是一个正确的xtype，我测试过，处理你的问题不是你的面板，我想这里很多人的答案都是正确的，问题要么是你的面板宽度，要么是自定义css，要么是面板的容器，仔细检查，或者在视图中张贴容器代码/屏幕截图，也许我可以找出是什么阻止您的组合框正确显示