问题
I want to remove the check box which enables selecting all items from the table (sap.m.Table
).
I tried:
var oTable = this.byId('MyTableId');
oTable._getSelectAllCheckbox().setVisible(false);
It didn't work for me. Is there a way to set it false in XML? I know I can use CSS but I want to use CSS only if there is no other solution.
回答1:
sap.m.Table
(aka. Responsive Table)
Currently, there is no publicly documented API to enable/disable showing the "Select All"-CheckBox on sap.m.Table
. Best practice in this case is to extend the control and to switch the bPreventMassSelection
state accordingly.
Here is a snippet from the sample: https://embed.plnkr.co/pnpdRK7d7CxZXZ8s
sap.ui.define([
"sap/m/Table",
"sap/m/TableRenderer",
], function(Table, TableRenderer) {
"use strict";
return Table.extend("demo.control.MyResponsiveTable", {
metadata: {
properties: {
showSelectAll: {
type: "boolean",
bindable: true,
},
},
},
setShowSelectAll: function(bValue) {
this.bPreventMassSelection = !bValue;
this.setProperty("showSelectAll", bValue);
return this;
},
renderer: TableRenderer,
});
});
<demo:MyResponsiveTable xmlns:demo="demo.control"
showSelectAll="{/showSelectAll}"
mode="MultiSelect">
Compared to _getSelectAllCheckbox
, the above approach should be favored since:
_getSelectAllCheckbox
is a private method.- Private methods are not intended to be used outside of the control definition.
- Relying on private methods and/or manipulating the internal control (
CheckBox
) will break the app in future UI5 releases.
- The
bPreventMassSelection
on the other hand is a simple flag which is already used widely in other controls that rely onsap.m.Table
/.List
internally. We can see that Table skips rendering the "Select All"-CheckBox ifbPreventMassSelection
is enabled.
sap.ui.table.Table
(aka. Grid Table)
In case someone was looking for the solution but with sap.ui.table.Table
, set the enableSelectAll property to false
:
<table:Table xmlns:table="sap.ui.table"
enableSelectAll="false"
selectionMode="MultiToggle">
回答2:
oTable._getSelectAllCheckbox().setVisible(false);
worked as expected for me.
I've added it as follows:
this._myDelegate = {
onAfterRendering: function () {
if (typeof this._getSelectAllCheckbox === "function" && this._getSelectAllCheckbox().isA("sap.m.CheckBox")) {
this._getSelectAllCheckbox().setVisible(false);
}
}
};
oTable.addEventDelegate(this._myDelegate, oTable);
// Remove this._myDelegate from the table in `onExit` to avoid memory leak
Make sure you have the right table control on var oTable = this.byId("MyTableId");
.
来源:https://stackoverflow.com/questions/51324035/how-to-hide-select-all-checkbox-from-table