Question

我有一个简单的表（类型为sap.ui.table.Table），我允许我的用户对元素进行排序，过滤和分组。但是，一旦应用，就不可能删除排序或分组？可以通过在过滤器中输入任何值来删除过滤器，但如何删除排序/分组??

var oTableEmpl = new sap.ui.table.Table({
  width : "100%",
  visibleRowCount : 20,
  selectionMode : sap.ui.table.SelectionMode.Multi,
  navigationMode : sap.ui.table.NavigationMode.Scrollbar,
  editable : false,
  enableCellFilter : true,
  enableColumnReordering : true,
  enableGrouping : true,
  extension : oMatrixLayout,
});

 oTableEmpl.addColumn(new sap.ui.table.Column({
       label : new sap.ui.commons.Label({
             text : "Label",
             textAlign : sap.ui.core.TextAlign.Center
       }),
       template : new sap.ui.commons.TextView({
             text : "{Value}",
             textAlign : sap.ui.core.TextAlign.Center
       }),
       visible : false,
       sortProperty: "Value",
       filterProperty: "Value",
}));

这可能看起来很简单，但在表格本身中没有删除任何内容的选项......它是否真的必须通过编程来删除？

Answer 1

是的，只有通过编码才能做到这一点。基本上，您需要清除ListBinding的排序器和过滤器，然后刷新DataModel。对于分组，请将Table和Column的分组重置为false，重置后，将Table的分组设置为true。

//set group of table and column to false          
oTableEmpl.setEnableGrouping(false);
oTableEmpl.getColumns()[0].setGrouped(false);

var oListBinding = oTableEmpl.getBinding();
oListBinding.aSorters = null;
oListBinding.aFilters = null;
oTableEmpl.getModel().refresh(true);

//after reset, set the enableGrouping back to true
oTableEmpl.setEnableGrouping(true);

我还附上了一个有效的代码片段。请检查一下。

＆＃13;

<script id='sap-ui-bootstrap' type='text/javascript' src='https://sapui5.hana.ondemand.com/resources/sap-ui-core.js' data-sap-ui-libs="sap.m,sap.ui.commons,sap.ui.table,sap.viz" data-sap-ui-theme="sap_bluecrystal"></script>

<script id="view1" type="sapui5/xmlview">
    <mvc:View xmlns:core="sap.ui.core" xmlns:layout="sap.ui.commons.layout" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.ui.commons" xmlns:table="sap.ui.table" controllerName="my.own.controller" xmlns:html="http://www.w3.org/1999/xhtml">
        <layout:VerticalLayout>
            <Button text="Reset" press="onPress" />
            <table:Table id="testTable" rows="{/}" enableGrouping="true">
                <table:Column sortProperty="abc" sorted="true" visible="true">
                    <table:label>
                        <Label text="abc"></Label>
                    </table:label>
                    <table:template>
                        <Label text="{abc}"></Label>
                    </table:template>
                </table:Column>
                <table:Column>
                    <table:label>
                        <Label text="abc2"></Label>
                    </table:label>
                    <table:template>
                        <Label text="{abc2}"></Label>
                    </table:template>
                </table:Column>
            </table:Table>
        </layout:VerticalLayout>
    </mvc:View>
</script>


<script>
    sap.ui.controller("my.own.controller", {
        onInit: function() {
            var aTableData = [{
                abc: 1,
                abc2: "a"
            }, {
                abc: 6,
                abc2: "b"

            }, {
                abc: 6,
                abc2: "c"

            }, {
                abc: 3,
                abc2: "g"

            }, {
                abc: 3,
                abc2: "h"

            }];
            var oTableModel = new sap.ui.model.json.JSONModel();
            oTableModel.setData(aTableData);

            var oTable = this.getView().byId("testTable");
            oTable.setModel(oTableModel);
            oTable.sort(oTable.getColumns()[0]);
        },
        onPress: function() {

            var oTable = this.getView().byId("testTable");
            //set group of table and column to false

            oTable.setEnableGrouping(false);
            oTable.getColumns()[0].setGrouped(false);
            var oModel = oTable.getModel();
            var oListBinding = oTable.getBinding();
            oListBinding.aSorters = null;
            oListBinding.aFilters = null;

            oModel.refresh(true);
            //after reset, set the enableGroup back to true
            oTable.setEnableGrouping(true);
        }


    });

    var myView = sap.ui.xmlview("myView", {
        viewContent: jQuery('#view1').html()
    }); // 
    myView.placeAt('content');
</script>

<body class='sapUiBody'>
    <div id='content'></div>
</body>

＆＃13;

Answer 2

对于 openui5 v1.78.7 ：如果要从表中删除这些过滤器，则：

您可以这样做：

  var columns = this.byId("tableId").getColumns();
  for (var i = 0, l = columns.length; i < l; i++) {
    var isFiltered = columns[i].getFiltered();
    if (isFiltered) {
      // clear column filter if the filter is set
      columns[i].filter("");
    }
  }

您可以使用以下方法清除排序过滤器：

    var columns = table.getColumns();
    var sortedCols = table.getSortedColumns();
    for (var i = 0, l = columns.length; i < l; i++) {
      if (sortedCols.indexOf(columns[i]) < 0) {
        columns[i].setSorted(false);
      }
    }

如果有以下任何一项，请确保对行绑定设置后退排序：

    table.getBinding("rows").sort(new Sorter(sPath, bDescending));

SAPUI5表 - 删除过滤器/分组/排序？

2 个答案: