SAPUI5 TextView无法按预期工作

时间:2017-11-21 08:33:12

标签: sapui5

我想将TextView SAPUI5控件放在 status div中,然后是 salesorder div。最初评论TextView放置。取消注释后,以下 salesorder 表格不再可见,TexView控件仍显示初始值(" status")。

这是 app.js

var ODataModel = sap.ui.model.odata.ODataModel,
    TextView = sap.ui.commons.TextView,
    Label = sap.ui.commons.Label,
    DataTable = sap.ui.table.DataTable,
    Toolbar = sap.ui.commons.Toolbar,
    Button = sap.ui.commons.Button,
    Column = sap.ui.table.Column,
    Right = sap.ui.commons.layout.HAlign.Right,
    Begin = sap.ui.commons.layout.HAlign.Begin,
    SelectionMode = sap.ui.table.SelectionMode;

var salesOrderService =
        "/sap/opu/odata/sap/ZGW100_00_SO_SRV",
        asJson = false,
    salesOrderModel = new ODataModel(salesOrderService, asJson),
    salesOrderCollection = "SalesOrderCollection";

var oTextView = new sap.ui.commons.TextView();
oTextView.setText("A simple text to be displayed.");
oTextView.setTooltip("Some Tooltip");
//oTextView.placeAt("status");

var salesOrders = new DataTable({
        title: "title",
        width: "600px",
        visibleRowCount: 20,
        toolbar: toolbar,
        selectionMode: SelectionMode.None,
        editable: false
 });

var salesOrderColumns = [
    { header: "Sales Order ID", value: "{SalesOrderID}", width: '100px' },
    { header: "Customer Name", value: "{CustomerName}", width: '100%' },
    { header: "Net", value: "{NetSum}", width: '100px', hAlign: Right },
    { header: "Tax", value: "{Tax}", width: '100px', hAlign: Right },
    { header: "Total", value: "{TotalSum}", width: '100px', hAlign: Right }
];

salesOrderColumns.forEach(function (options) {
    var label = new Label({ text: options.header }),
        template = new TextView({ text: options.value }),
        column = new Column({
            label: label,
            template: template,
            width: options.width,
            hAlign: options.hAlign || Begin
        });

    salesOrders.addColumn(column);
});

salesOrders.setModel(salesOrderModel);

salesOrders.bindRows(salesOrderCollection);

salesOrders.placeAt("salesorders");

这是 index.html

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv='X-UA-Compatible' content='IE=edge' />
        <title>Node.js calling SAP Gateway</title>

        <script id="sap-ui-bootstrap"
           src="resources/sap-ui-core.js"
           data-sap-ui-theme="sap_goldreflection"
           data-sap-ui-libs="sap.ui.commons, sap.ui.table"></script>

        <script src="app.js"></script>
    </head>
    <body class="sapUiBody">
         <img src="images/watson.png" />
         <div class=”main-container”>
           <div id=”status”>status</div>
          <div id="salesorders"></div>
         </div>            
    </body>
</html>

0 个答案:

没有答案