SAP UI5的RadioButtonGroup如果选择
问题描述:
我目前正试图实现与UI5条件的路由...SAP UI5的RadioButtonGroup如果选择
这是我view.xml用:
<VBox class="sapUiSmallMargin">
<RadioButtonGroup id="bgroup" columns="2" class="sapUiMediumMarginBottom">
<buttons>
<RadioButton id="RB1" text="start with segmentation"/>
<RadioButton id="RB2" text="start with target group"/>
</buttons>
</RadioButtonGroup>
</VBox>
<m:HBox>
<m:items>
<m:StandardTile title="End-of-Warranty" infoState="None" icon="sap-icon://car-rental" press="_onStandardTilePress"/>
<m:StandardTile title="End-of-Leasing" infoState="None" icon="sap-icon://car-rental"/>
</m:items>
<m:layoutData/>
</m:HBox>
这就是我的js文件正在现在:
sap.ui.define([
"sap/ui/core/mvc/Controller"
], function(Controller) {
"use strict";
return Controller.extend("wizard.controller.page1", {
_onStandardTilePress: function (oEvent) {
var oapp = sap.ui.getCore().byId("dcw");
oapp.to("idpage2");
}
});
}
)
目前,它只是导航到idpage2,如果您单击StandardTile End of of Warranty。 RadioButtons没有被识别,没有条件。
我想要做的:只有导航如果选择ID为RB1单选按钮来idpage2。如果选择了RB2,请导航到idpage3。
有什么想法?谢谢
答
在定义要导航的位置之前,您应该检查RadioButtons的“selected”属性。使用getSelected()函数: https://sapui5.hana.ondemand.com/#docs/api/symbols/sap.m.RadioButton.html#getSelected
这里与信息片段您提供:
<!DOCTYPE html>
<html>
\t <head>
\t \t <meta http-equiv='X-UA-Compatible' content='IE=edge'>
\t \t <meta charset="utf-8">
\t \t <title>MVC with XmlView</title>
\t \t <!-- Load UI5, select "blue crystal" theme and the "sap.m" control library -->
\t \t <script id='sap-ui-bootstrap'
\t \t \t src='https://sapui5.hana.ondemand.com/resources/sap-ui-core.js'
\t \t \t data-sap-ui-theme='sap_belize_plus'
\t \t \t data-sap-ui-libs='sap.m'
\t \t \t data-sap-ui-xx-bindingSyntax='complex'></script>
\t \t <!-- DEFINE RE-USE COMPONENTS - NORMALLY DONE IN SEPARATE FILES -->
\t \t <!-- define a new (simple) View type as an XmlView
\t \t - using data binding for the Button text
\t \t - binding a controller method to the Button's "press" event
\t \t - also mixing in some plain HTML
\t \t note: typically this would be a standalone file -->
\t \t <script id="view1" type="sapui5/xmlview">
\t \t <mvc:View xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc" controllerName="my.own.controller">
<App id="dcw">
<pages>
<Page id="idpage1">
<VBox class="sapUiSmallMargin">
<RadioButtonGroup id="bgroup" columns="2" class="sapUiMediumMarginBottom">
<buttons>
<RadioButton id="RB1" text="start with segmentation"/>
<RadioButton id="RB2" text="start with target group"/>
</buttons>
</RadioButtonGroup>
</VBox>
<HBox>
<items>
<StandardTile title="End-of-Warranty" infoState="None" icon="sap-icon://car-rental" press="_onStandardTilePress"/>
<StandardTile title="End-of-Leasing" infoState="None" icon="sap-icon://car-rental" press="_onStandardTilePress"/>
</items>
<layoutData/>
</HBox>
</Page>
<Page id="idpage2" showNavButton="true" navButtonPress="onNavBack">
<ObjectHeader title="Page2 - start with segmentation"/>
</Page>
<Page id="idpage3" showNavButton="true" navButtonPress="onNavBack">
<ObjectHeader title="Page3 - start with target group"/>
</Page>
</pages>
</App>
\t \t </mvc:View>
</script>
\t \t <script>
\t \t \t // define a new (simple) Controller type
\t \t \t sap.ui.controller("my.own.controller", {
\t \t \t \t _onStandardTilePress: function (oEvent) {
var oapp = this.getView().byId("dcw");
if(this.getView().byId("RB1").getSelected()){
oapp.to(this.getView().byId("idpage2"));
}
else if(this.getView().byId("RB2").getSelected()){
oapp.to(this.getView().byId("idpage3"));
}
},
onNavBack: function(oEvent){
oEvent.getSource().getParent().back();
}
\t \t \t });
\t
\t \t \t // instantiate the View
\t \t \t var myView = sap.ui.xmlview({viewContent:jQuery('#view1').html()}); // accessing the HTML inside the script tag above
\t \t
\t \t \t myView.placeAt('content');
\t \t </script>
\t
\t </head>
\t <body id='content' class='sapUiBody'>
\t </body>
</html>
答
检查的实例?
在 “_onStandardTilePress”
- 得到的是选择
- 路线适当
你在哪里卡住的单选按钮
此制定了罚款,谢谢! –
太棒了!很高兴听到它!您可以将其标记为解决方案,以便更容易地找到具有相同标志的其他人的解决方案 –