单击按钮,在浏览器的新选项卡中打开sapui5详细信息页面

时间:2015-04-08 06:01:53

标签: javascript sapui5

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <script src="resources/sap-ui-core.js"
                id="sap-ui-bootstrap"
                data-sap-ui-libs="sap.m,sap.ui.table,sap.ui.commons"
                data-sap-ui-theme="sap_bluecrystal">
        </script>
        <!-- only load the mobile lib "sap.m" and the "sap_mvi" theme -->

        <script>
                var bFlag;
                sap.ui.localResources("views");
                sap.ui.localResources("i18n");
                sap.ui.localResources("utils");
                jQuery.sap.registerModulePath('Application', 'Application');
                jQuery.sap.require("Application");
                var oApp = new Application({
                    root : "content"
                });
        </script>
<link href="css/stylesheet.css" rel="stylesheet" type="text/css">

    </head>
    <body class="sapUiBody" role="application">
        <div id="content"></div>
    </body>
</html>

我正在开发一个sapui5应用程序,其中我有一个拆分应用程序,现在在工具栏的详细信息页面上我有一个名为open的按钮在新窗口中。所以我想打开这个特定的详细信息页面(仅单击此按钮的新选项卡中的详细信息页面 任何人都可以帮我解决这个问题吗?

提前致谢。

的问候,
Shalini

2 个答案:

答案 0 :(得分:0)

基本上,您可以在JavaScript中打开一个新选项卡,如下所示:

window.open("<yourURL>", _blank');

对于您的SAPUI5应用程序,您只需在加载View / Controller的专用URL处提供额外的.html文件。如果要将主/明细表应用程序中的信息传递到新选项卡,可以添加URL参数。

正如我在您编辑的问题中所看到的,您正在使用应用程序。我不知道进一步的结构(特别是你的Application.js做了什么),但在一个单独的.html中,一个非常简单的解决方案可能如下所示:

<script>
            sap.ui.localResources("views");
            sap.ui.localResources("i18n");
            sap.ui.localResources("utils");
            sap.ui.jsview("name.of.your.detailView").placeAt("content");
</script>

如果要重用Application.js文件,可以对其进行扩展并传递一个简单的参数,该参数告诉只显示一个View。

还有一件事:我猜您在应用程序的某处使用了sap.m.SplitApp。要仅显示DetailView,您应该在此时使用sap.m.App

答案 1 :(得分:0)

使用SAP的 Router API。 基本上,在manifest.json文件中定义路由器,路由,模式和目标对象:

*
*
*
"sap.ui5": {
"_version": "1.1.0",
"rootView": {
    "viewName": "path.to.view.name",
    "type": "XML"
},
"routing": {
  "config": {
    "routerClass": "sap.m.routing.Router",
    "viewType": "XML",
    "viewPath": "path.to.view",
    "controlId": "init",
    "controlAggregation": "pages"       
  },
  "routes": [
    {
      "pattern": "",
      "name": "init",
      "target": "init",
      "viewId": "vid_init"
    },
    {
      "pattern": "url_parameter",
      "name": "target_name",
      "target": "target_name",
      "viewId": "vid_view_name"
    }
  ],
  "targets": {
    "target_name": {
      "viewName": "view_name",
      "transition": "show"
    }
*
*
*

在按钮的属性中分配 press 事件处理程序:

<Button id="myButton" press="openNewWindow" />

在视图的控制器中编写代码以处理事件。示例:

 openNewWindow: funtion(oEvent){

  //Open new Window
  sap.m.URLHelper.redirect("#/url_parameter");

}

获取有关https://sapui5.hana.ondemand.com/#/api/sap.ui.core.routing.Router的更多信息

祝一切顺利