有人知道如何将RowEditor中的复选框设置到中心位置吗? 我使用Ext JS 6.0.0主题“triton”。
复选框位于行的顶部,但文本字段或组合框等其他字段位于中心。
看起来像:
我已经将复选框的样式对象设置为align: center
,但它不起作用。
plugins: { ptype: 'rowediting', clicksToEdit: 2, saveBtnText: 'Übernehmen', cancelBtnText: 'Abbrechen' },
initComponent: function() {
var me = this;
me.store = 'MeasurementPoint';
me.columns = [
{
xtype: 'actioncolumn',
width: 50,
sortable: false,
hideable: false,
resizable: false,
menuDisabled: true,
draggable: false,
items: [
{
icon: 'Content/images/icon_32/garbage.png',
tooltip: 'Löscht den Eintrag',
handler: function(view, rowIdx, colIdx, item, ev, record) {
Ext.Msg.show({
title: 'Löschen bestätigen!',
msg: 'Soll der Messpunkt \"' + record.data.Name + '\" wirklich gelöscht werden?',
width: 300,
buttons: Ext.Msg.YESNO,
fn: function(btn) { if (btn === 'yes') view.ownerCt.getStore().remove(record); },
//animateTarget: rowIdx,
icon: Ext.window.MessageBox.QUESTION
});
}
},
{
icon: 'Content/images/icon_32/pencil.png',
tooltip: 'Bearbeitet den Eintrag',
handler: function(view, rowIdx, colIdx, item, ev, record) {
if (this.__form)
return;
this.__form = Ext.widget('window', {
layout: 'fit',
width: 500,
title: 'Messpunkt bearbeiten',
items: { xtype: 'measurementpointform', header: false },
}).show();
this.__form.down('button[itemId=save-measurementpoint]').action = 'update-measurementpoint';
this.__form.down('form').loadRecord(record);
this.__form.on('close', function() { this.__form = false }, this, { single: true });
}
}
]
},
{
xtype: 'gridcolumn',
dataIndex: 'Active',
text: 'Aktiv',
width: 70,
renderer: AWA.ImageRenderer.CROSS,
editor: {
xtype: 'checkbox',
}
},
{
xtype: 'gridcolumn',
dataIndex: 'Manually',
text: 'Manuell',
width: 90,
renderer: AWA.ImageRenderer.TICK,
editor: {xtype: 'checkbox'}
}
谢谢你们帮忙的答案
答案 0 :(得分:0)
我已经覆盖了CSS,它适用于我
.x-grid-editor .x-form-cb-wrap {
vertical-align: middle;
}
由于