2017-03-03 4 views
1

Ich verwende UI5, um eine Tabelle zu rendern und mit dem ViewSettingsDialog-Steuerelement zu sortieren/gruppieren/zu filtern. In meinem OData-Service habe ich eine Entitäten "Projekte" festgelegt, und jeder hat einen Kunden zugeordnet (ein Kunde kann mehrere Projekte haben). Auf der anderen Seite habe ich eine Entität "Kunden" festgelegt. Es zeigt mehr als 1000 Einträge Kunden, aber nicht alle haben ein Projekt, so dass ich es nicht für die Aggregation von Elementen in ViewSettingsFilterItem verwenden kann.SAPUI5 Entfernen von Duplikaten in Aggregationsbindung

Um den ViewSettingsDialog-Filter nach Kunden zuzulassen, übergebe ich die "projects" -Entität, die für die Elemente-Aggregation in ViewSettingsFilterItem festgelegt wurde. Aber diejenigen Kunden, die mehr als ein Projekt haben, erscheinen mehr als einmal.

Wie kann ich die Bindung beschränken, um nur einmal die Kunden mit mehr als einem Projekt zu zeigen?

prüfen diese Schnipsel mit Northwind: https://jsbin.com/sakurisoxo/edit?html,output

Wenn Sie den Filter gehen, können Sie sehen, wie sie wiederholt

Danke im Voraus

[Code]

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <title>SAPUI5</title> 
     <script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js" 
      id="sap-ui-bootstrap" 
      data-sap-ui-theme="sap_belize" 
      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="25" 
        growingScrollToLoad="true" 
        busyIndicatorDelay="0" 
        items="{/Orders}"> 
        <headerToolbar> 
         <Toolbar> 
          <Title text="Orders of ALFKI"/> 
          <ToolbarSpacer/> 
          <Button text="Click here for filters" press="onDialogOpen"/> 
         </Toolbar> 
        </headerToolbar> 
        <columns> 
         <Column> 
          <Text text="OrderID"/> 
         </Column> 
         <Column> 
          <Text text="CustomerID"/> 
         </Column> 
        </columns> 
        <items> 
         <ColumnListItem> 
          <cells> 
           <Text text="{OrderID}"/> 
           <Text text="{CustomerID}"/> 
          </cells> 
         </ColumnListItem> 
        </items> 
       </Table> 

      </mvc:View> 
     </script> 

     <!-- XML Fragment --> 
     <script id="myXMLFragment" type="ui5/fragment"> 
      <core:FragmentDefinition 
       xmlns="sap.m" 
       xmlns:core="sap.ui.core"> 
       <ViewSettingsDialog 
        confirm="onTableSettingsConfirm"> 
        <sortItems> 
         <ViewSettingsItem text="OrderID" key="OrderID" selected="true" /> 
        </sortItems> 
        <filterItems> 
         <ViewSettingsFilterItem 
          text="CustomerID" 
          key="CustomerID" 
          multiSelect="true" 
          items="{path: '/Orders', sorter: [{path: 'CustomerID', descending: false}]}"> 
          <items> 
           <ViewSettingsItem text="{CustomerID}" key="{CustomerID}" /> 
          </items> 
         </ViewSettingsFilterItem> 
        </filterItems> 
       </ViewSettingsDialog> 
      </core:FragmentDefinition> 
     </script> 

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

       //### Controller ### 
       sap.ui.define([ 
        "sap/ui/core/mvc/Controller", 
        "sap/ui/model/odata/v2/ODataModel" 
       ], function (Controller, ODataModel) { 
        "use strict"; 

        return Controller.extend("MyController", { 

         _oTableSettingsDialog: null, 

         onInit : function() { 
          this.getView().setModel(
           new ODataModel("https://cors-anywhere.herokuapp.com/services.odata.org/V2/Northwind/Northwind.svc/") 
          ); 
         }, 

         onDialogOpen: function(){ 
          if (!this._oTableSettingsDialog) { 
           this._oTableSettingsDialog = sap.ui.xmlfragment({ 
            fragmentContent : jQuery("#myXMLFragment").html() 
           }); 
           this._oTableSettingsDialog.setModel(this.getView().getModel()); 
          } 
          this._oTableSettingsDialog.open(); 
         } 

        }); 
       }); 

       //### 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> 
+0

Ich frage mich, warum können Sie die Kunden-IDs nicht nach Projektnamen gruppieren? Auf diese Weise können Sie separate Abschnitte für jedes Projekt erstellen und jedes Projekt zeigt Kunden-IDs an. Oder gruppieren Sie sich selbst nach Kunden-IDs. Lassen Sie mich wissen, ob das hilft. https://sapui5.hana.ondemand.com/#docs/guide/c4b2a32bb72f483faa173e890e48d812.html –

+0

Hallo Rahul, ich implementiere auch Gouping in meiner App (nicht im Snippet), aber trotzdem muss ich die Filterfunktionalität implementieren. Ich sollte eine rohe reaktionsfähige Tabelle mit vielen Einträgen (7 Spalten) rendern und bieten die Möglichkeit für ** Sortieren & Gruppierung & Filterung ** die Spaltenwerte Deshalb verwende ich ViewSettingsDialog Steuerelement https://sapui5.hana.ondemand.com /explored.html#/sample/sap.m.sample.TableViewSettingsDialog/preview Gruppierung und Sortierung funktioniert reibungslos, aber ich habe das beschriebene Problem für die Filter. –

+0

Hallo Rafael, ich wollte nur erwähnen, dass Sie vielleicht [sap.ui.table.Table] (https://openui5.hana.ondemand.com/explored.html#/entity/sap.ui.table) in Erwägung ziehen könnten .Tabelle/Beispiele) anstelle von SAP.M.Table. Die letztgenannte Kontrolle ist nicht dazu gedacht, mit einer großen Menge von Daten fertig zu werden, und wird ein signifikantes Leistungsproblem mit 7 Spalten haben (besonders im IE). Ich musste es schmerzlich durch Erfahrung lernen. – boghyon

Antwort

0

Wenn viele Projekteinträge vorhanden sind, ist das manuelle Entfernen von Duplikaten auf der Clientseite wahrscheinlich alles andere als optimal. Auch die filter Abfrage von V2 unterstützt nicht die Suche nach Eigenschaften in der erweiterten Sammlung, die V4 auf der anderen Seite unterstützt.

Ich würde vorschlagen, Kunden (anstelle von Projekten) im verbindlichen Pfad zu verwenden und das Backend über Ihre Anforderung zu informieren, indem Sie custom query definieren, um nur die Kunden mit einem oder mehreren Projekten zu erhalten.

+1

Am Ende habe ich etwas wie das, was Sie erklärt. Hier das [Snippet] (https://jsbin.com/coraperisa/edit?html,output) –

0

Gibt es einen besonderen Grund dafür, die Filterwerte nicht direkt an den Kundenentitätssatz zu binden? Auf diese Weise wird jeder der Kunden nur einmal angezeigt. Leider können Sie mit OData v2 nicht die Kunden aussortieren, die keine Bestellungen haben. Dafür müssen Sie eine spezialisierte Entity (basierend auf einer Ansicht) vom Backend erhalten.

Umgekehrt können Sie nicht wirklich filtern, um Duplikate direkt zu entfernen. Sie könnten entweder versuchen, eine Art Workaround mit der Gruppierung durchzuführen (ich glaube nicht, dass Sie das erreichen können), Sie könnten alle Ihre Daten in einem JSON-Modell lesen und diese Filterung manuell durchführen oder Sie könnten versuchen, die OData-Liste zu wechseln Binding Operation-Modus zu "Client" (die tatsächlich liest alle Aufträge -> nicht wirklich perfekt) und implementieren eine benutzerdefinierte Filterfunktion, um die Duplikate zu entfernen.

+0

Danke Serban! Das ist, was ich dachte ... scheint wie "einzigartige" Anrufe können nicht gegen den OData-Service durchgeführt werden. Ich denke über Filter sie in Client-Seite mit JS, aber ich werde ein Problem haben, wenn es viele Einträge (wie in der Northwind Orders entitySet) mit dem gleichen Kunden ... Ich werde nicht alle Einträge abrufen und daher Ich habe gerade ein Stück von den Kunden ... –

0

Wenn Sie nach Kunden sortieren und dann in Ihrer Tabelle zuerst die CustomerId-Spalte und dann die OrderId-Spalte platzieren (Ihr Beispiel verweist darauf), können Sie das Attribut <Column mergeDuplicates="true" ... /> für die Kundenspalte verwenden.

Dies würde verhindern, dass sich die Kundenkennung wiederholt - dies könnte Ihre Absicht gewesen sein?

+0

Hallo Bernand, danke, aber das Problem ist nicht in der Tabelle. Der Tisch ist in Ordnung, die Kunden werden wiederholt. Das Problem ist in der ** ViewSettingsFilterItem ** Artikel Aggregation, so wenn Sie die Filter auswählen, die Liste der Kontrollkästchen erscheint mit dem gleichen Kunden mehrmals –

Verwandte Themen