首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在我的SAP UI5 SmartTable中启用过滤?

在SAP UI5 SmartTable中启用过滤可以通过以下步骤实现:

  1. 首先,在SmartTable的XML视图中,确保已经引入了SmartFilterBar控件。例如:
代码语言:txt
复制
<mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns="sap.ui.comp.smartfilterbar" xmlns:smartTable="sap.ui.comp.smarttable">
    <smartTable:SmartTable id="mySmartTable" smartFilterId="mySmartFilterBar" tableType="ResponsiveTable" />
    <SmartFilterBar id="mySmartFilterBar" />
</mvc:View>
  1. 在控制器中,获取SmartTable和SmartFilterBar的引用,并将SmartFilterBar与SmartTable进行关联。例如:
代码语言:txt
复制
sap.ui.define([
    "sap/ui/core/mvc/Controller"
], function(Controller) {
    "use strict";

    return Controller.extend("myController", {
        onInit: function() {
            this._oSmartTable = this.getView().byId("mySmartTable");
            this._oSmartFilterBar = this.getView().byId("mySmartFilterBar");

            this._oSmartTable.setSmartFilterId(this._oSmartFilterBar.getId());
        }
    });
});
  1. 在SmartTable的XML视图中,为需要过滤的列添加相应的配置。例如:
代码语言:txt
复制
<smartTable:SmartTable id="mySmartTable" smartFilterId="mySmartFilterBar" tableType="ResponsiveTable">
    <smartTable:Table>
        <Table id="myTable" rows="{path: '/MyEntitySet'}">
            <columns>
                <Column>
                    <Text text="Column 1" />
                </Column>
                <Column>
                    <Text text="Column 2" />
                </Column>
            </columns>
            <items>
                <ColumnListItem>
                    <cells>
                        <Text text="{Column1}" />
                        <Text text="{Column2}" />
                    </cells>
                </ColumnListItem>
            </items>
        </Table>
    </smartTable:Table>
</smartTable:SmartTable>
  1. 在SmartFilterBar的XML视图中,为需要过滤的字段添加相应的配置。例如:
代码语言:txt
复制
<SmartFilterBar id="mySmartFilterBar">
    <GroupItems>
        <GroupItem groupName="Group 1" name="Field1" label="Field 1" />
        <GroupItem groupName="Group 1" name="Field2" label="Field 2" />
    </GroupItems>
</SmartFilterBar>
  1. 在控制器中,根据过滤条件获取数据并刷新SmartTable。例如:
代码语言:txt
复制
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/model/Filter",
    "sap/ui/model/FilterOperator"
], function(Controller, Filter, FilterOperator) {
    "use strict";

    return Controller.extend("myController", {
        onInit: function() {
            this._oSmartTable = this.getView().byId("mySmartTable");
            this._oSmartFilterBar = this.getView().byId("mySmartFilterBar");

            this._oSmartTable.setSmartFilterId(this._oSmartFilterBar.getId());
        },

        onFilter: function() {
            var aFilters = [];

            var sField1 = this._oSmartFilterBar.getControlByKey("Field1").getValue();
            if (sField1) {
                var oFilter = new Filter("Column1", FilterOperator.EQ, sField1);
                aFilters.push(oFilter);
            }

            var sField2 = this._oSmartFilterBar.getControlByKey("Field2").getValue();
            if (sField2) {
                var oFilter = new Filter("Column2", FilterOperator.EQ, sField2);
                aFilters.push(oFilter);
            }

            var oBinding = this._oSmartTable.getTable().getBinding("rows");
            oBinding.filter(aFilters);
        }
    });
});

以上步骤完成后,用户在SmartFilterBar中输入过滤条件后,点击过滤按钮,SmartTable将根据条件过滤数据并刷新显示。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

如何创建SAP UI5项目?

1、微信:如何创建SAP UI5项目? 2、知乎:如何创建SAP UI5项目? -不耐烦以及狂妄自大很可怕! 看不到图片,可以去公众号查看。...SAP UI5SAP UI Development Toolkit for HTML5简称,它是一套基于HTML5UI开发组件,是SAP为了快速开发前述Fiori风格UI、构建企业级产品javascript...我们在做SAP UI5开发时候,除了Eclipse,SAP目前还提供了WebIDE可以直接在线开发,当然,这些工具现在还不是很普遍被使用,这也是传统开发转变一个难点(关于SAP UI5其他内容,...选择SAP UI5 我们可以通过过滤条件,输入sapui5和Cloud Foundry,作为条件来筛选需要磁贴应用,这样可以查找到名为SAPUI5 Application磁贴,然后单击Next。...项目文件 我们单击文件夹图标,把目录展开,有一些关于SAP UI5架构内容,在以前也推送过,可以查看公众号文章(公众号:SAP Technical),显示如下图所示: ?

68920

乾坤大挪移:CRM WebClient UI 和 SAP Fiori UI 混搭并存

SAP CRM里有个功能可以创建HANA live report,消费HANA Studio里创建模型。...最后创建好report长这个样子: 具体创建步骤可以参考博客Step by Step to create HANA live report in Webclient UI 这些report肉眼上看去显示在...这是怎么实现呢? 红色方框里UI区域实际上是一个UI5应用: Webclient UIBSP应用直接通过Iframe把这个UI5应用crm_ana_od_ui5嵌进去。...C4C后台ABAP程序转换成JavaScript,最后在浏览器里执行是JavaScript: 关于更多Ruby script在SAP C4C应用,请参考博客Ruby Script in C4C...所有支持语言列表: SAP UI5 UI5思路和WebClient UI类似,多语言文本维护在i18n properties文件里。详细原理介绍参考博客。

55400
  • SAP Fiori - 快速指南

    SAP Fiori提供300多个基于角色应用程序,人力资源,制造,财务等。当您打开SAP Fiori主页应用程序时,您将看到一张花图片。这是因为Fiori意味着“花”意大利语。...SAP Fiori UI5有五个设计原则 。这些原则使SAP Fiori简单并将不同事务分解为简单基于任务UI应用程序。...· SAP Fiori事务性应用程序用于执行事务性任务,例如管理员 - 员工事务(离开请求,差旅请求等)。...分析应用程序用于提供有关业务操作基于角色实时信息。 分析应用程序集成了SAP HANA与SAP业务套件强大功能。它从前端Web浏览器大量数据提供实时信息。...NetWeaver Gateway · SAP HANA SAP Fiori - 架构 下面给出了SAP Fiori架构高级环境关键组件。

    78830

    SAP NetWeaver版本和SAP Kernel版本的确定

    SAP NetWeaver(SAP NW)描述了用于“业务启用所有软件和服务。SAP业务套件(ERP中央组件(ECC)或供应商关系管理(SRM))包含该特定业务解决方案软件组件。...SAP Business Warehouse(BW)Accelerator是为提高SAP BW数据加载和查询性能而开发示例之一。...业务启用应用程序 - 其中包含业务支持应用程序,SAP流程集成(PI),企业门户和商业智能软件套件。...使用SAP NetWeaver Gateway,基于JAVASAP UI5和基于HTML5应用程序开发移动和Web应用程序灵活和简单开发环境。.../4HANA 2020 S4CORE:106 代表SAP S/4HANA 2021 而S4SP补丁级别可以在已安装产品版本SP stack获取,如图

    47620

    ABAP和Hybris源代码生成工具比较

    Composer 或者用另一种土办法,直接把待生成类或者报表源代码准备好,填入一个内表(下图例子mt_source)里,然后用关键字GENERATE生成: 这种办法一个具体使用场景,参考博客...help.hybris.com 使用help.hybris.com时,发现每次在搜索栏输入文字时,没有发出任何HTTP请求,那么这个自动完成下拉框里记录从哪里来?...看了下实现,发现所有自动完成下拉框里记录都是硬编码在searchsuggestion.js里: Hybris help网站只用了bootstrap框架: help.sap.com 在搜索框里输入字符后...注意产品明细这个url: 这个明细页面的路由和SAP UI5路由思路很像。...在SAP UI5应用里,每个页面都会有一个对应路由配置信息。该信息结构如下图所示,包含一个页面的逻辑名称,路由target url和页面的实际名称。

    72200

    SAP行业未来发展如何,和chatGPT聊聊SAP行业发展前景

    SAP行业简介 时代在变,环境在变,全球ERP软件市场和企业发展水平一直在变,业人员数量都远超十年前,SAP咨询行业可以说是发展得如火荼,兴盛繁华。...问问chat GPT,SAP行业未来发展 各行各业企业无论是数量还是质量都发生了天翻地覆变化。很多人会焦虑自己哪天就跟不上时代脚步了。今天,来和chat GPT聊聊SAP行业未来发展。...2、SAP专业知识和专业技能,保证了SAP顾问优势。 3、专业认可,是不是考虑考个PA证书了。 4、高薪酬。 5、由于SAP系统庞大,发展空间还是很大。...ABAP是一个比较不一样团体,和其他开发语言不同,作为SAP系统专有的开发语言,也同样存在着这样一群开发群体,同样称为IT人士程序员, 当然这里chatGPT没有给出很细节内容,比如JavaScript...,css,HTML,UI5等内容。

    26630

    那些年用过开源项目(一)

    近期微软收购github新闻热搜各大媒体,微软,曾经开源极力反对者,近几年也是积极拥抱开源。司近来也是积极拥抱开源,贡献了包括ui5,cloudfoudry等非常流行开源项目。...相比原生selenum,nightwatch提供了更加友好API。 ui5 sap推出基于mvc架构前端框架,封装了html和css,开发者只需使用提供control。...cloudfoudry 现在云平台主要可以分为iaas、paas、saas,而cloudfoundry是构建paas平台一个主流开源项目,现在sap,ibm,pivotal都有基于cloudfoundry...slf4j simple logging facade for java,统一大多数流行logging框架,log4j、logback,提供了一个统一API。...lombok 可用一些简单annotation替代重复简单编写代码,@Getter会自动生成所有fieldget方法。

    68110

    SAP BTP & Fiori 应用模版项目

    前言作为 SAP ERP 系统用户、业务顾问或开发人员,您有没有想过除了原生 SAP Fiori UI5 框架或 GUI 之外还有没有其他方式可以开发 SAP 应用程序?...这里给大家介绍一个开源项目,它可以帮助您使用现代前端框架 Vue、Angular 等快速开发 SAP Fiori 应用程序,而无需编写大量代码。...项目代码仓库中有详细介绍文档和各技术点文档,以下简单介绍其主要功能和优势:基础框架:此项目是一个完整基础框架,可用于快速构建 SAP Fiori 应用程序并一键部署到 SAP 系统。...优势综上所述,此项目具有完整系统前端功能,有读者可能会问“为什么需要用这样一个新框架?”...现代编译框架( Vite)、异步渲染和按需加载组件能极大地提高性能。提供了状态管理工具有效地管理应用程序状态和数据流。这对于处理大型和复杂 SAP Fiori 应用非常有帮助。灵活性和可扩展性。

    26410

    浅谈SAP Fiori设计美感与发展历程

    SAP Fiori来源灵感是什么,想最重要一点是使SAP系统处理更加容易。还记得这么年来我们对SAP GUI吐槽吗。...到现在SAP UI5已经发展到1.65这个版本了(在SAP Cloud Platform上提供),新Quartz主题简约,轻便,甚至在颜色设计上都花了很大功夫,每一种颜色细微变化,每一个图形棱角改变都在追求完美体验...觉得CoPilot应该是SAP Fiori 3.0最重要变化。在我看来CoPilot看起来像Launchpad一个小插件,或者是一个小公举,看一下这个小公举可以做什么呢。...还记得在SAP Fiori 2.0时候,SAP推出了用于在IOS系统上Natio Fiori应用程序编程库。...SAP Fiori概念和设计原则是SAP设计主导开发流程关键组件,可确保通过所有SAP产品交付到SAP Fiori创新应用。

    1K70

    推荐 11 个 GitHub 上比较热门 Java 项目

    框架发布版本,包括集成CLI(命令行界面),可以在Spring仓库手动下载和安装。...具有如下特性: ● 创建独立Spring应用程序 ● 嵌入Tomcat,无需部署WAR文件 ● 简化Maven配置 ● 自动配置Spring ● 提供生产就绪型功能,指标,健康检查和外部配置 ●...绝对没有代码生成和对XML没有要求配置 6 smartTable https://github.com/huangyanbin/smartTable Star 1200 ?...SmartTable 是一套数据源使用 Ajax 获取数据,并展现成表格与图像形式,并且支持下载(思路源于talkingdata)智能表格。...控件,集成分页控件,可对表格数据集进行客户端分页,亦可对表格数据集进行客户端排序,JavaScript 控件: ● TableView(数据表格控件), 可配置标题, 计数, 行复选框, 过滤

    1.1K20

    浅谈SAP Fiori设计美感与发展历程

    SAP Fiori来源灵感是什么,想最重要一点是使SAP系统处理更加容易。还记得这么年来我们对SAP GUI吐槽吗。...到现在SAP UI5已经发展到1.65这个版本了(在SAP Cloud Platform上提供),新Quartz主题简约,轻便,甚至在颜色设计上都花了很大功夫,每一种颜色细微变化,每一个图形棱角改变都在追求完美体验...觉得CoPilot应该是SAP Fiori 3.0最重要变化。在我看来CoPilot看起来像Launchpad一个小插件,或者是一个小公举,看一下这个小公举可以做什么呢。...image.png 还记得在SAP Fiori 2.0时候,SAP推出了用于在IOS系统上Natio Fiori应用程序编程库。...SAP Fiori概念和设计原则是SAP设计主导开发流程关键组件,可确保通过所有SAP产品交付到SAP Fiori创新应用。

    83330

    推荐11个GitHub上比较热门Java项目

    框架发布版本,包括集成CLI(命令行界面),可以在Spring仓库手动下载和安装。...具有如下特性: ● 创建独立Spring应用程序 ● 嵌入Tomcat,无需部署WAR文件 ● 简化Maven配置 ● 自动配置Spring ● 提供生产就绪型功能,指标,健康检查和外部配置 ●...绝对没有代码生成和对XML没有要求配置 6 smartTable https://github.com/huangyanbin/smartTable Star 1200 ?...SmartTable 是一套数据源使用 Ajax 获取数据,并展现成表格与图像形式,并且支持下载(思路源于talkingdata)智能表格。...控件,集成分页控件,可对表格数据集进行客户端分页,亦可对表格数据集进行客户端排序,JavaScript 控件: ● TableView(数据表格控件), 可配置标题, 计数, 行复选框, 过滤

    1.1K20

    SAP ABAP——SAP简介(三)【S4 HANA开发环境】

    在学习工作通常使用偏后端开发语言ABAP,SQL进行任务完成,对SAP企业管理系统,SAP ABAP开发和数据库具有较深入研究。...工作批准财务应用程序,计算应用程序和各种自助服务应用程序。   听起来似乎有点绕口是吗?...SAP 前端服务器 SAP ABAP前端服务器包含Fiori系统和NetWeaver网关所有UI组件。这些UI组件由中央UI添加,SAP UI5控制库和SAP Fiori Launchpad组成。...它还包含产品特定UI。附件包含各种业务套件UI开发,ERP,SCM,SD,MM等。SAP NetWeaver Gateway用于设置SAP业务套件与目标客户端,平台和框架之间连接。...综上所述,借用阿诺德·施瓦辛格一句话来总结——"老了,但我并不过时"!SAP GUI不可替代,但不会再是唯一选择了。 ----

    81121

    从秘书到程序员 一位德国妹子艰难转型之路

    以下为译文: 目前,在德国SAP担任Swift/SAP UI5/JavaScript开发人员,而曾经却是一名秘书。大家肯定会感动吃惊,是如何实现?...在word里面写和朋友故事,在excel中进行各种计算,在MS Paint画画,玩游戏。订购了一本计算机杂志,它教会了一切有关电脑知识。...后来,还参加了一些专为女性开设科技活动,比如访问大学、参加一些讲座,在这个过程能够与正在学习计算机技术女孩交谈,这些正是想要。...它并不是100%纯计算机科学,还包括网络和自动化工程、大量信号传输、手机等——但也包含了编程方面的基础知识,OOP、算法与数据结构、数据库、软件工程、模型……关键是,这些课程是可以兼职学习。...辞掉工作并搬到了学习所在城市。因为缺乏IT工作经验,很难获得一份相关工作。幸运是,获得了奖学金——但我仍然想工作!通过同学关系,了解了SAP,而他也是SAP内部项目的项目经理。

    1.1K70

    SAP HANA催促着数据库变革

    经过2年市场洗礼,从总体上看还是O要多些,S市场份额要远低于O,但从技术角度来看,SAP方案更加开放,更加提现出一个基于完整生态圈合作方式。...但SAP有强大用户群作为支撑,只要使用许可证适当低廉方式,应该可以稳定住很大一部分企业级市场,但这是否将会大量爆发,还需要其商务运行手段与底线。...也只有这样配套才能更加发挥出系统优势。一切都还将随着技术与市场变化而变化。 但是个人不太推荐使用Js作为服务端开发语言,也不建议一个上10W规模都集成在HANA内置。...UI5是一个不错方案,但是将这些集成在NANA需要更多场景分析,没有最好技术方案,只有更好技术方案。...新数据中心启用,新数据库技术也会启用,而且是革命性质,而不是改良性质; 3.对系统架构与系统开发将是很大挑战,需要做必要技术储备(如果是大企业,一定是内存技术而不是其他); 4.热数据,温数据

    16210

    ERP期初数据导入之LTMC&Script脚本综合运用

    仅用于SAP软件应用与学习,不代表SAP公司。注:文中SAP相关字或图片,相应著作权归SAP所有。...一、LTMC录入期初数据 1、配置Host文件,在C:\Windows\System32\drivers\etc,将host文件新增SAP服务器地址等内容; 2、SAP GUI事务代码栏输入LTMC...如遇到过工厂日历未配置18年,但是开始日期维护18年,报承诺日期问题,所以先保证数据在GUI可以过。 10、完成之后,数据导入SAP,之后登陆GUI查看,已成功创建项目。...同理创建首层WBS,注意,目前发现LTMCWBS都只有首层,所以如何在创建项目定义和首层WBS之后,方便快捷将剩余WBS搭建,在WBS模板搭建成功基础上,可采用Script脚本方式。...二、Script脚本重复操作录入数据 1、首先查看SAP脚本录制和回放功能有无启用 若未启用,则需要输入事务代码:RZ11,输入参数名称:sapgui/user_scripting点击回车键,进入“参数详细信息

    1.8K50

    笔记整理-ABAP示例程序

    ABAP程序集合处理:SAPRSAMT ABAP程序分析:RSANAL00 查找ABAP语言程序统计分析:RSABAPSC DDIC和SAP*被锁定后如何启用SAP*账户 具体步骤为:...1.修改参数文件的如下参数:login/no_automatic_user_sapstar = 0 2.重启启动sap服务。...如何在用户登录时SAP时自动执行Tcode或者其他一些东西 1) 在SAP进去初始界面(SAP Easy Access)菜单:细节->设置启动事务....上方工具栏->增益集(可能名称不一样,是繁体),会有一条工具栏出现 4.说白了就是打开BEx analyzer,这里你可以创建/修改 Workbook,它跟Excel做了整合,突出与Office...; 7、维护,创建条目START_IMAGE(已存在则不需要创建); 8、参数值填入步骤3创建对象名; 9、保存 还有一种方法, 笔记,请参考:swm0 - > 选择 WebRFC 应用程序二进制数据

    1.4K22

    matinal:什么是 SAP BTP?

    诸如此类问题,很容易迷失在各种手册和配置无法自拔,那么下面就试着从全局层面解释下为什么会有这些设计。 首先看这张图,这是基于自己理解绘制一张简单架构图,我们按照顺序解释。 1....SAP集成套件就是一种无代码方式进行API操纵工具,SAP流程自动化也是通过无代码方式进行机器人开发和审批流管理,SAPBuild Apps更是当下非常火热无代码应用开发,可以开发跨平台端到端应用程序...,Python等各色程序,SAP也有自己开发后端开发框架SAP CAP可以较为方便结合SAP技术栈和外部开源世界。...比如,曾经作为SAP One Support Launchpad上搜索功能负责人,那我团队就会被分配到一个名字叫做searchSpace里,和我团队成员不能访问search之外Space,...如果感兴趣可以在SAPcommunity直接搜索比如Kyma上如何构建UI5程序进一步了解。

    15410

    SAP小技巧 成本价检查及自动维护体系

    声明:本文仅代表原作者观点,仅用于SAP软件应用与学习,不代表SAP公司。注:文中所示截图来源SAP软件,相应著作权归SAP所有。...一、前言 成本价是ERP系统商品重要库存属性之一,如果商品没有成本价, 会导致商品凭证没有对应会计凭证(或者会计凭证成本相关金额为0)....对于通过了配置表过滤商品凭证行,如果读取成本价为0, 报错。...写入时需要注意 把写入逻辑放入一个独立程序,通过调用程序启用一个新进程执行. 如不启用进程. 增强报错后续回滚逻辑会影响自定义表写入.(如果对自定义表写入提交又会影响标准处理过程)。...---- 免责声明:本文所用视频、图片、文字涉及作品版权问题,请第一时间告知,我们将根据您提供证明材料确认版权并按国家标准支付稿酬或立即删除内容!

    85020

    用PYTHON自动登录SAP GUI

    我们都知道,SAP原生“脚本录制和回放”功能是在用户进入到某一个SAP”用户指定系统“后才可以启用:   也就是说,从这里开始,您可以通过脚本录制,生成用户名、密码输入和SAP登录过程完整代码...程序需要首先完成SAP 应用程序自动启动,python方法有很多种,用到方法如下: sap_app = r"C:\Program Files (x86)\SAP\FrontEnd\SAPgui...我们不妨试试一个更简单直接方法,对照上图,先捕获到③过滤句柄,使用sendmessage方法输入过滤条件(要登录系统名称),激活该条件,此时我们目标系统②就会自然处于第一位且被”高亮“,然后我们捕获左上角...①(登录)句柄,单击它进入到系统登录界面,后续登录代码通过原生SAP脚本录制方法得到,您也可以使用”Tracker“工具来快速录制出python下可用SAP自动化代码(小爬之前文章简要介绍过该工具...); PS:   程序要考虑SAP启动、系统双击打开等都需要一定时间消耗,所以要添加延迟来解决,而延迟时间长短可以通过while True循环配合Try except方法来灵活调整,整个过程用

    93510
    领券