SAPUI5 sap.m.Entrée - Suggestion valeurs

Comment puis-je me permettre de vivre des suggestions de lecture à partir de mon Service odata pour une seule cellule de mon tableau?

oTable.addColumn(new sap.ui.table.Column({
                template : new sap.m.Input({
                    value : column, //also works, its dynamic
                    textAlign : sap.ui.core.TextAlign.Center,
                    inputType : Text,
                    type : sap.m.InputType.Text,
                    showSuggestion : true,
                    liveChange : function() {
                        if (this.getValue().length > 0) {
                            var oModel = new sap.ui.model.json.JSONModel();
                            var value = this.getValue();
                            var serviceUrl = "/sap/opu/odata/SAP/XXXX_SRV/SuggestionsSet/?$filter=startswith(Key,'" + value + "')";
                            oModel.loadData(serviceUrl, null, false, "GET", false, false, null);

                            this.destroySuggestionItems();
                            for (var i = 0; i < oModel.oData.d.results.length; i++) {
                                this.addSuggestionItem(new sap.ui.core.Item({
                                    text: oModel.oData.d.results[i].Key,
                                }));
                            } //everything seems fine, but no Suggestion opens..


                        }
                    },
                }),
                visible : true,
            }));
InformationsquelleAutor dotchuZ | 2015-12-03
  1. 6

    Voir le exploré exemple.
    Cependant, dans votre cas, le modèle est une ODataModel, mais qui n'a pas vraiment d'importance...
    Comme vous pouvez le voir dans les exemples de code que vous pouvez également utiliser 

    showSuggestion="true"
suggest="handleSuggest"
suggestionItems="{/ProductCollection}"

    Dans le gestionnaire vous ensuite de le faire (copié à partir de l'exemple en tant que bien):

    handleSuggest: function(oEvent) {
    var sTerm = oEvent.getParameter("suggestValue");
    var aFilters = [];
    if (sTerm) {
        aFilters.push(new Filter("Name", sap.ui.model.FilterOperator.StartsWith, sTerm));
    }
    oEvent.getSource().getBinding("suggestionItems").filter(aFilters);
}

    Fondamentalement, vous
    - créer un ou plusieurs filtres
    - obtenir la liaison pour l' suggestionItems agrégation
    - appel .filtre(...) sur la liaison et de passer le filtre(s)

    Il n'y a pas besoin de code de ce genre de choses manuellement (c'est à dire OBTENIR la demande, etc.).

    Ici est un runninh exemple pour vous (exécuter via jsbin), voir ci-dessous.
    Dans votre cas, tout ce que vous faites est de se lier à 

    suggestionItems="{path:'/SuggestionSet', templateShareable:false}">

    Dans le handleSuggest handler, vous serait alors d'obtenir la valeur pour l' Clé propriété de la SuggestionSet qui appartient courant/champ de saisie afin d'instancier un nouveau Filtre. Vous pourriez obtenir de l' Clé de la BindingContext je suppose...

    <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>SAPUI5 single file template | nabisoft</title>
        <script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"
            id="sap-ui-bootstrap"
            data-sap-ui-theme="sap_bluecrystal"
            data-sap-ui-libs="sap.m"
            data-sap-ui-bindingSyntax="complex"
            data-sap-ui-compatVersion="edge"
            data-sap-ui-preload="async"></script>
            <!-- use "sync" or change the code below if you have issues -->

            <!-- XMLView -->
            <script id="myXmlView" type="ui5/xmlview">
                <mvc:View
                    controllerName="MyController"
                    xmlns="sap.m"
                    xmlns:core="sap.ui.core"
                    xmlns:mvc="sap.ui.core.mvc">

                    <Table
                        id="myTable"
                        growing="true"
                        growingThreshold="10"
                        growingScrollToLoad="true"
                        busyIndicatorDelay="0">
                        <columns>
                            <Column>
                                <Text text="Customer ID"/>
                            </Column>
                            <Column>
                                <Text text="Company Name"/>
                            </Column>
                        </columns>
                        <items>
                            <!-- filled via bindItems() in controller -->
                        </items>
                    </Table>

                </mvc:View>
            </script>

            <!-- XML Fragment -->
            <script id="myXMLFragment" type="ui5/fragment">
                <core:FragmentDefinition
                    xmlns="sap.m"
                    xmlns:core="sap.ui.core">
                    <ColumnListItem type="Active">
                        <cells>
                            <ObjectIdentifier title="{CustomerID}"/>

                            <Input
                                value="{CompanyName}"
                                showSuggestion="true"
                                suggest="handleSuggest"
                                suggestionItems="{path:'/Customers', templateShareable:false}">
                                <suggestionItems>
                                    <core:Item text="{CompanyName}" />
                                </suggestionItems>
                            </Input>

                        </cells>
                    </ColumnListItem>
                </core:FragmentDefinition>
            </script>


        <script>
            sap.ui.getCore().attachInit(function () {
                "use strict";

                //### Controller ###
                sap.ui.controller("MyController", {
                    onInit : function () {

                        this.getView().setModel(
                            new sap.ui.model.odata.v2.ODataModel("https://cors-anywhere.herokuapp.com/services.odata.org/V2/Northwind/Northwind.svc/", {
                                json : true,
                                useBatch : false
                            })
                        );

                        var sPath = "/Customers";
                        var oTable = this.byId("myTable");
                        var oTemplate =  sap.ui.xmlfragment({
                            fragmentContent : jQuery("#myXMLFragment").html()
                        });

                        oTable.bindItems(sPath, oTemplate, null /*oSorter*/, null /*aFilters*/);
                    },
                    handleSuggest: function(oEvent) {
                        var sTerm = oEvent.getParameter("suggestValue");
                        var aFilters = [];
                        if (sTerm) {
                            aFilters.push(new Filter("CompanyName", sap.ui.model.FilterOperator.StartsWith, sTerm));
                        }
                        oEvent.getSource().getBinding("suggestionItems").filter(aFilters);
                    }
                });

                //### THE APP: place the XMLView somewhere into DOM ###
                sap.ui.xmlview({
                    viewContent : jQuery("#myXmlView").html()
                }).placeAt("content");

            });
        </script>

    </head>

    <body class="sapUiBody">
        <div id="content"></div>
    </body>
</html>
    • pas exactement ce que je demandais, j'ai eu beaucoup de cellules, chaque cellule a d'autres suggestionItems, c'est pourquoi je les charger dynamiquement au cours de liveChange avec un oData demande...
    • Pour chaque cellule, je peux voir votre requête GET à l'air d'être le même, sauf une autre "valeur". la valeur est la sTerm dans ma suggestion. Cela signifie que vous pouvez lier le suggestionItems de votre modèle "{/SuggestionSet}", à droite? Pourquoi ne serait-ce pas le travail?
    • J'ai mis à jour la réponse et a ajouté un exemple de travail. Est-ce que vous cherchez?
    InformationsquelleAutor Nabi