2016-10-06 17 views
0

JSONModelで1つのテーブルを実装しました。今度はソートとフィルタリングのためのツールバーに2つのボタンを追加したいと思います。どうすればそれを達成できますか?私はJSでビューを作成したので、JSのコードヘルプは高く評価されています。UI5テーブル(sap.m.Table)でフィルタリングとソートを実装する方法

参照のために以下のコードを見つけてください。ソートとフィルタリングボタンを実装するのを手伝ってください。

sap.ui.jsview("com.sap.view.View1", { 

    /** Specifies the Controller belonging to this View. 
    * In the case that it is not implemented, or that "null" is returned, this View does not have a Controller. 
    * @memberOf controller.View1 
    */ 
    getControllerName: function() { 
     return "com.sap.controller.View1"; 
    }, 

    /** Is initially called once after the Controller has been instantiated. It is the place where the UI is constructed. 
    * Since the Controller is given to this method, its event handlers can be attached right away. 
    * @memberOf controller.View1 
    */ 
    createContent: function(oController) { 

     var oColumn1 = new sap.m.Column({ 
     header: new sap.m.Label({text: "ID"})} 
     ); 
     var oColumn2 = new sap.m.Column({ 
     header: new sap.m.Label({text: "First Name"})} 
     ); 
     var oColumn3 = new sap.m.Column({ 
      header: new sap.m.Label({text: "Last Name"})} 
     ); 
     var oColumn4 = new sap.m.Column({ 
     header: new sap.m.Label({text: "Email"})} 
     ); 
     var oColumn5 = new sap.m.Column({ 
     header: new sap.m.Label({text: "City"})} 
     ); 

     var oTable = new sap.m.Table("idTabel",{ 
       headerToolbar: new sap.m.Toolbar({ 
      content: [ 
      /* new sap.m.Label({ 
        text: "Sales Order List" 
       }), new sap.m.ToolbarSpacer({}),*/ 

       new sap.m.Button("idPersonalizationButton", { 
        icon: "sap-icon://action-settings" 
       }), 
        new sap.m.Button("idFSG", { 
        icon: "sap-icon://filter" 
       }) 

      ] 
     }), 
      headerText: "Employee", 
      columns:[oColumn1,oColumn2,oColumn3,oColumn4,oColumn5], 
      mode: sap.m.ListMode.SingleSelectMaster, 
      selectionChange:[oController.onSelect, oController] 

     }); 


     var oTemp = new sap.m.ColumnListItem({ 
      cells: [new sap.m.Text({text: "{id}"}), 
        new sap.m.Text({text: "{first_name}"}), 
        new sap.m.Text({text: "{last_name}"}), 
        new sap.m.Text({text: "{email}"}), 
        new sap.m.Text({text: "{city}"})] 


     }); 

     oTable.bindItems({ 
      path: "/details", 
      template: oTemp 
     }); 

     // oTable.setModel(oModel); 

     return new sap.m.Page({ 
     title: "Simple Table", 
     content: [oTable 
     ] 
    }); 
    } 

}); 
+0

動的フィルタリングのチェックアウトの場合:から例 FacetFilter(素敵なUIを持つ)https://sapui5.hana.ondemand.com/#docs/api/symbols/sap.m.FacetFilter.html#constructor SAP: https://sapui5.hana.ondemand.com/explored.html#/sample/sap.m.sample.FacetFilterSimple/preview ソートするには、Id:sap.ui.getCore()。byIdによってテーブルを取得します。 ( "idTable")。sort( ""、SortOrder.Ascending); SortOrder.Ascendingが機能しない場合、文字列「昇順」を使用することもできます。 – Beka

答えて

0

私は同じ問題がありました。 私の結論:

使用したい場合はsap.m.Table唯一の方法は、プロパティuseTablePersonalisationを設定することです:「真」 それとも、操作が容易であるsap.ui.Tableを使用しますが、それはです醜い、古い。

関連する問題