<!DOCTYPE HTML>
<html style="height: 100%;">
  <head>
    <meta charset="utf-8">
    <title>Demo</title>
    <script defer id="sap-ui-bootstrap"
      src="https://sdk.openui5.org/nightly/resources/sap-ui-core.js"
      data-sap-ui-libs="sap.ui.core,sap.m,sap.ui.table,sap.ui.layout"
      data-sap-ui-async="true"
      data-sap-ui-on-init="onUI5Init"
      data-sap-ui-resource-roots='{"demo": "./"}'
      data-sap-ui-compat-version="edge"
      data-sap-ui-exclude-jquery-compat="true"
      data-sap-ui-xx-wait-for-theme="init"
    ></script>
    <script>
      globalThis.onUI5Init = () => sap.ui.require([
        "sap/ui/core/mvc/XMLView",
        "sap/ui/model/json/JSONModel",
      ], (XMLView, JSONModel) => XMLView.create({
        viewName: "demo.view.App",
        height: "100%",
        models: new JSONModel(sap.ui.require.toUrl("demo/data.json")),
      }).then(view => view.placeAt("content")));
    </script>
  </head>
  <body class="sapUiBody" id="content"></body>
</html>
sap.ui.define([
  "sap/m/Table",
  "sap/m/TableRenderer",
], function(Table, TableRenderer) {
  "use strict";

  return Table.extend("demo.control.MyResponsiveTable", {
    renderer: TableRenderer,
    metadata: {
      properties: {
        showSelectAll: {
          type: "boolean",
          bindable: true,
        },
      },
    },

    setShowSelectAll: function(bValue) {
      this.bPreventMassSelection = !bValue;
      this.setProperty("showSelectAll", bValue); // register and trigger invalidate
      return this; // to allow method chaining
    },

  });
});
{
  "showSelectAll": true,
  "myCollection": [
    {
        "key": 1,
        "text1": "Text 1",
        "text2": "Text 2"
    },
    {
        "key": 2,
        "text1": "Text 1",
        "text2": "Text 2"
    },
    {
        "key": 3,
        "text1": "Text 1",
        "text2": "Text 2"
    }
  ]
}
<mvc:View xmlns:mvc="sap.ui.core.mvc"
  xmlns="sap.m"
  xmlns:core="sap.ui.core"
  displayBlock="true"
  height="100%"
>
  <App autoFocus="false">
    <Page
      title="&#34;Select All&#34;-CheckBox in Tables"
      class="sapUiResponsiveContentPadding"
    >
      <headerContent>
        <Switch state="{/showSelectAll}" />
      </headerContent>
      <core:Fragment fragmentName="demo.view.fragment.ResponsiveTable" type="XML" />
      <core:Fragment fragmentName="demo.view.fragment.GridTable" type="XML" />
    </Page>
  </App>
</mvc:View>
<columnmenu:Menu id="myMenu" xmlns:columnmenu="sap.m.table.columnmenu">
  <columnmenu:items>
    <columnmenu:Item icon="sap-icon://sap-ui5" label="My Item" />
    <!-- ... -->
  </columnmenu:items>
  <columnmenu:quickActions>
    <!-- ... -->
  </columnmenu:quickActions>
</columnmenu:Menu>
<table:Table xmlns:table="sap.ui.table"
  xmlns="sap.m"
  xmlns:core="sap.ui.core"
  selectionMode="MultiToggle"
  enableSelectAll="{/showSelectAll}"
  class="sapUiSmallMarginTop"
  rows="{
    path: '/myCollection',
    key: 'key'
  }"
>
  <table:extension>
    <Toolbar class="sapMTBHeader-CTX">
      <Title text="sap.ui.table.Table using &#34;enableSelectAll&#34;" />
    </Toolbar>
  </table:extension>
  <table:Column label="Column 1" template="text1" headerMenu="myMenu">
    <table:dependents>
      <core:Fragment fragmentName="demo.view.fragment.ColumnMenu" type="XML" />
    </table:dependents>
  </table:Column>
  <table:Column label="Column 2" template="text2" />
</table:Table>
<demo:MyResponsiveTable xmlns:demo="demo.control"
  xmlns="sap.m"
  xmlns:core="sap.ui.core"
  headerText="Extended sap.m.Table"
  showSelectAll="{/showSelectAll}"
  mode="MultiSelect"
  growing="true"
  items="{
    path: '/myCollection',
    key: 'key'
  }"
>
  <demo:columns>
    <Column headerMenu="responsive--myMenu">
      <Text text="Column 1" />
      <dependents>
        <core:Fragment id="responsive"
          fragmentName="demo.view.fragment.ColumnMenu"
          type="XML"
        />
      </dependents>
    </Column>
    <Column>
      <Text text="Column 2" />
    </Column>
  </demo:columns>
  <ColumnListItem>
    <Text text="{text1}" />
    <Text text="{text2}" />
  </ColumnListItem>
</demo:MyResponsiveTable>