extjs ext js组合框中的css样式

3htmauhk  于 2022-11-05  发布在  其他
关注(0)|答案(3)|浏览(226)

我的代码:

{
  border: 1,
  bodyStyle: 'margin:0 0 0 140px;',
  style: {
    borderColor: 'black',
    borderStyle: 'solid', //margin:'0 0 0 140' //margin-left: '140px' }, width: 140, name: 'comp', id:'compId', triggerAction: 'all', mode: 'local', store: new Ext.data.SimpleStore({
    fields: ['myId', 'displayText'],
    data: [
      [1, 'item1'],
      [2, 'item2']
    ]
  }), displayField: 'displayText', xtype: 'combo',
},

在Ext js 2.3中bodyStyle没有被附加到组合框中。有人能建议如何解决这个问题吗?
谢谢

kcrjzv8t

kcrjzv8t1#

我想这可能是你需要的。

{
    xtype: 'combo'
    style : 'margin-left: 140px; border: solid black 1px;',
    name: 'comp', 
    id:'compId', 
    triggerAction: 'all', 
    mode: 'local', 
    store: new Ext.data.SimpleStore({
        fields: ['myId', 'displayText'],
        data: [
          [1, 'item1'],
          [2, 'item2']
        ]
      }), 
    displayField: 'displayText',
    valueField : 'myId'

}

请注意,根据文档-http://docs.sencha.com/extjs/2.3.0/#!/api/Ext.form.组合框,没有bodyStyle配置选项
我删除了宽度选项,就像左边距样式属性(也是140 px)一样,我想你可能会得到一些奇怪的东西。

ut6juiuv

ut6juiuv2#

组合. js:

{xtype:'combobox', cls:'combo'}

combo.css:

.combo .x-boundlist-selected {
  background: #757575;
  background-image: -webkit-linear-gradient(top, #757575, #474747);
  background-image: -moz-linear-gradient(top, #757575, #474747);
  background-image: -ms-linear-gradient(top, #757575, #474747);
  background-image: -o-linear-gradient(top, #757575, #474747);
  background-image: linear-gradient(to bottom, #757575, #474747);
  border: solid #4e4e4e 2px;
  color: #ffffff;
  text-decoration: none;
}

.combo .x-boundlist-item {
  background: #757575;
  background-image: -webkit-linear-gradient(top, #757575, #474747);
  background-image: -moz-linear-gradient(top, #757575, #474747);
  background-image: -ms-linear-gradient(top, #757575, #474747);
  background-image: -o-linear-gradient(top, #757575, #474747);
  background-image: linear-gradient(to bottom, #757575, #474747);
  border: solid #4e4e4e 2px;
  color: #ffffff;
  text-decoration: none;
}
z8dt9xmd

z8dt9xmd3#

这是在2.3版本中使用bodyStyle属性的代码之一,这可能会对您有所帮助。

this.itemCombo= new Ext.form.ComboBox({
                name : "combooo",
                fieldLabel : "Status",
                displayField : 'combo',
                valueField : 'id',
                mode : 'local',
                triggerAction : 'all',
                hiddenName : "comboo",
                editable : false,
                width : 100,
                store : this.store,
                value : "0"
            });

    this.frmPanel = new Ext.form.FormPanel({
                bodyStyle : "padding:10px",
                border : true,
                autoScroll : true,
                layout : "table",
                layoutConfig : {
                    columns : 1,
                    style : "vertical-align:top"
                },
                items : [{
                    bodyStyle : "padding-right:10px",
                    xtype : "panel",
                    layout : "form",
                    border : false,
                    labelWidth : 110,
                    colspan : 2,
                    items : [this.item1,this.itemCombo]
                }]
            });

相关问题