SAPUI5使用格式化程序基于字段过滤OData模型

Question

I have a List that contains ObjectListItems with content provided by an OData service. One of this contents is the title and the property has the value as follows:

title="{ path: 'title', formatter: 'app.schedule.util.Formatter.titleText'}"

As you can see there is a formatter in this title. The OData will bring a value like "available" or "disabled" and the formatter will transform it on the text for the specific language of the user.

I'm implementing a search capability on this List and it works fine, the problem is that it searchs only on the "available" and "disabled" values, and not in the formatted texts as it would be expected as this are not the values recognized by the user.

The filter code is:

handleSearch : function (evt) {
    // create model filter
    var filters = [];
    var query = evt.getParameter("query");
    if (query && query.length > 0) {
        filters.push(new sap.ui.model.Filter("booked", sap.ui.model.FilterOperator.Contains, query));
        filters.push(new sap.ui.model.Filter("weekday", sap.ui.model.FilterOperator.Contains, query));
        filters.push(new sap.ui.model.Filter("title", sap.ui.model.FilterOperator.Contains, query));
        filters = new sap.ui.model.Filter(filters, false);
    }

    // update list binding
    var list = this.getView().byId("list");
    var binding = list.getBinding("items");
    binding.filter(filters);
},

Any idea on how to consider the formatter on the filter and not only the raw data?

Answer 1

Solution Considering you are doing only client side search: Assumption: if you have grouping in the list..

handleSearch : function (evt) {
    sFilterPattern = evt.getParameter("query");
    sFilterPattern = sFilterPattern.toLowerCase();
        var aListItems = this.getView().byId("list").getItems();
        var bVisibility;
        var oGroupItem = null;
        var iCountInGroup = 0;
        for (var i = 0; i < aListItems.length; i++) {
            if (aListItems[i] instanceof sap.m.GroupHeaderListItem) {
                if (oGroupItem) {
                    if (iCountInGroup == 0) {
                        oGroupItem.setVisible(false);
                    } else {
                        oGroupItem.setVisible(true);
                        oGroupItem.setCount(iCountInGroup);
                    }
                }
                oGroupItem = aListItems[i];
                iCountInGroup = 0;
            } else {
                bVisibility = this.applySearchPatternToListItem(aListItems[i], sFilterPattern);
                aListItems[i].setVisible(bVisibility);
                if (bVisibility) {
                    iCountInGroup++;
                }
            }
        }
        if (oGroupItem) {
            if (iCountInGroup == 0) {
                oGroupItem.setVisible(false);
            } else {
                oGroupItem.setVisible(true);
                oGroupItem.setCount(iCountInGroup);
            }
        }
}

applySearchPatternToListItem:function(oItem, sFilterPattern) {
    if (sFilterPattern == "") {
        return true;
    }
    //uncomment to search in oModel data 
    /*var oIteshellata = oItem.getBindingContext(this.sModelName).getProperty();
    for (var sKey in oIteshellata) {
        var sValue = oIteshellata[sKey];
        // if (sValue instanceof Date) {
        // //just for the filter take each number as string
        // sValue = sValue.getDate() + "." +
        // sValue.getMonth() + "." + sValue.getFullYear();
        // }
        if (typeof sValue == "string") {
            if (sValue.toLowerCase().indexOf(sFilterPattern) != -1) {
                return true;
            }
        }
    }*/
    // if nothing found in unformatted data, check UI elements
    if ((oItem.getIntro() && oItem.getIntro().toLowerCase().indexOf(sFilterPattern) != -1) 
    || (oItem.getTitle() && oItem.getTitle().toLowerCase().indexOf(sFilterPattern) != -1) 
    || (oItem.getNumber() && oItem.getNumber().toLowerCase().indexOf(sFilterPattern) != -1) 
    || (oItem.getNumberUnit() && oItem.getNumberUnit().toLowerCase().indexOf(sFilterPattern) != -1) 
    || (oItem.getFirstStatus() && oItem.getFirstStatus().getText().toLowerCase().indexOf(sFilterPattern) != -1) 
    || (oItem.getSecondStatus() && oItem.getSecondStatus().getText().toLowerCase().indexOf(sFilterPattern) != -1)) {
        return true;
    }
    // last source is attribute array
    var aAttributes = oItem.getAttributes();
    for (var j = 0; j < aAttributes.length; j++) {
        if (aAttributes[j].getText().toLowerCase().indexOf(sFilterPattern) != -1) {
            return true;
        }
    }
    return false;
}