Question

您好我正在尝试从Odata服务获取数据，我的要求是当使用valueHelpDialog选择行将选定的行数据放入多个输入字段时。

搜索帮助的输出：

选择的ID进入一个字段但是我的要求也想要进入剩余的2个字段，我的代码附在下面：

<View
xmlns="sap.m"
xmlns:l="sap.ui.layout"
xmlns:core="sap.ui.core"
xmlns:mvc="sap.ui.core.mvc"
xmlns:html="http://www.w3.org/1999/xhtml"
xmlns:f="sap.ui.layout.form" 
controllerName="Navigation.controller.View2">
<Page
    title="Second Page"
    showNavButton="true"
    navButtonPress="onBack">
    <content>
    <l:VerticalLayout
    class="sapUiContentPadding"
    width="100%">
    <Label text= "Orderinput" width="300px"/>
    <MultiInput id= "input" showValueHelp= "true" width="300px" valueHelpRequest= "handlef4"/>

    <l:HorizontalLayout>
    <Label text="planPlant" />
        <Input  id="InputNoEdit" class="sapUiSmallMarginBottom" type="Text"
            enabled="True"  editable="false" width="300px"/>

    <Label text="Description" />
        <Input  id="InputNoEdit2" class="sapUiSmallMarginBottom"    type="Text"
            enabled="True"  editable="false" width="300px"/>
    </l:HorizontalLayout>   

    <l:HorizontalLayout>
    <Label text="Product not editable" />
        <Input  id="InputNoEdit3" class="sapUiSmallMarginBottom"    type="Text"
            enabled="True"  editable="false" width="300px"/>
    <Label text="Product editable" />
        <Input  id="InputEdit1" class="sapUiSmallMarginBottom"  type="Text"
            enabled="true"  editable="true" width="300px"/>
    </l:HorizontalLayout>

    <l:HorizontalLayout>
    <Label text="Product editable" />
        <Input  id="InputEdit2" class="sapUiSmallMarginBottom"  type="Text"
            enabled="true"  editable="true" width="300px"/> 
    <Label text="simple DatePicker" labelFor="DP1"/>
        <DatePicker
        id="DP1"
        placeholder="Enter Date ..."
        change="handleChange"
        class="sapUiSmallMarginBottom"/>
    </l:HorizontalLayout>

    <l:HorizontalLayout>
    <Button type="Accept"
                    text="Accept"
                    press="onPress"
                    ariaDescribedBy="acceptButtonDescription genericButtonDescription"/>
    <Button type="Cancel"
                    text="Cancel"
                    press="onPress2"
                    ariaDescribedBy="acceptButtonDescription genericButtonDescription"/>
    </l:HorizontalLayout>
    </l:VerticalLayout>
    <!--</f:SimpleForm>-->
    </content>
</Page>

控制器代码：

jQuery.sap.require("sap.ui.comp.valuehelpdialog.ValueHelpDialog");

sap.ui.define([
"sap/ui/core/mvc/Controller", "sap/ui/core/routing/History"
], function(Controller, History) {
"use strict";

return Controller.extend("Navigation.controller.View2", {
 handlef4: function(){

    var oInput = sap.ui.getCore().byId("__xmlview1--input");
    var oInput2 = sap.ui.getCore().byId("__xmlview1--planPlant");
    if(!this._oValueHelpDialog){
        this._oValueHelpDialog = new sap.ui.comp.valuehelpdialog.ValueHelpDialog("idValueHelp",{
        supportMultiselect: false,
        supportRangesOnly: false, 
        stretch: sap.ui.Device.system.phone,
        keys: "Orderid",
        descriptionKey: "Orderid",
        filtermode: "true",
        ok: function(oEvent){
            var aTokens = oEvent.getParameter("tokens");
            oInput.setTokens(aTokens);
                this.close();
        },
        cancel: function(){
            this.close();
        }
        });
    }


        var oFilterBar = new sap.ui.comp.filterbar.FilterBar({
        advancedMode:  true,
        // filterBarExpanded: false,
        filterBarExpanded: true,
        showGoOnFB: !sap.ui.Device.system.phone,
        filterGroupItems: [new sap.ui.comp.filterbar.FilterGroupItem({ groupTitle: "foo", groupName: "gn1", name: "n1", label: "Orderid", control: new sap.m.Input()}),
                           new sap.ui.comp.filterbar.FilterGroupItem({ groupTitle: "foo", groupName: "gn1", name: "n2", label: "Description", control: new sap.m.Input()}),
                           new sap.ui.comp.filterbar.FilterGroupItem({ groupTitle: "foo", groupName: "gn1", name: "n3", label: "Planplant", control: new sap.m.Input()})],

        search: function(oEvt) {
            var oParams = oEvt.getParameter("selectionSet");
            var iOrder = oParams[0].getValue();
            var iType =  oParams[1].getValue();
            var iPlan = oParams[2].getValue();
            // sap.m.MessageToast.show("Search pressed '");
    oTable.bindRows({path: "/OrderDataSet", filters:  [
    new sap.ui.model.Filter( "Orderid",sap.ui.model.FilterOperator.EQ, iOrder ),
    new sap.ui.model.Filter("Description",sap.ui.model.FilterOperator.EQ, iType),
    new sap.ui.model.Filter("Planplant",sap.ui.model.FilterOperator.EQ, iPlan)]
      } );
        }
    });         

    this._oValueHelpDialog.setFilterBar(oFilterBar);
    var oColModel = new sap.ui.model.json.JSONModel();
    oColModel.setData({
        cols: [
                 {label: "Orderid", template: "Orderid"},
                 {label: "Description", template: "Description"},
                 {label: "Planplant", template: "Planplant"}
            ]
    });
    var oTable = this._oValueHelpDialog.getTable();
    oTable.setModel(oColModel,"columns");
    var oModel = new sap.ui.model.odata.ODataModel("/sap/opu/odata/SAP/ZP01_FIORI_SRV_01/");
    oTable.setModel(oModel);
    this._oValueHelpDialog.open();
  },
        onBack : function () {
        var sPreviousHash = History.getInstance().getPreviousHash();
        if (sPreviousHash !== undefined) {
            window.history.go(-1);
        } else {
            this.getOwnerComponent().getRouter().navTo("page1", null, true);
        }
    }
});

});

Answer 1

我的解决方案将基于以下数据（您只需修改一些内容）：

现在，我将有两个文本字段，其中，我将显示City和CurrencyCode（选择任何行i，e。'Ok'方法）。

以下是UI的外观：

XML代码：

    <f:SimpleForm 
        minWidth="1024"
        maxContainerCols="2"
        editable="true"
        layout="ResponsiveGridLayout"
        labelSpanL="3" labelSpanM="3" labelSpanS="12"
        emptySpanL="0" emptySpanM="0" emptySpanS="0"
        columnsL="1"   columnsM="1" 
        class="editableForm">
        <f:content>
            <m:Label text="Company"/>
            <m:MultiInput id="multiInput" valueHelpRequest="onValueHelpRequest"/>
            <m:Label text="City"/>
            <m:Text text='' id='city'/>
            <m:Label text="Currency" />
            <m:Text text='' id='currency'/>
        </f:content>
    </f:SimpleForm>

在选择任何字段时，我将在UI中填充City和CurrencyCode。以下是我的代码：

        ok: function(oControlEvent) {
            that.aTokens = oControlEvent.getParameter("tokens");
            that.theTokenInput.setTokens(that.aTokens);
            var oTable = oValueHelpDialog.getTable();
            var oContext = oTable.getContextByIndex(oTable.getSelectedIndex()).getObject();
            that.getView().byId('city').setText(oContext.City); //fetch description.
            that.getView().byId('currency').setText(oContext.CurrencyCode); //fetch Plant code.
            oValueHelpDialog.close();
        },

请注意我在ValueHelpHandler（F4）上设置了这个：

onValueHelpRequest: function() {
    var that= this;

如果这可以解决您的问题，请与我们联系。

将valueHelpDialog行数据提取到多个字段

1 个答案: