/scripts/ahub.form.attachments.js
0

SAPUI5 - Date/DateTime Filters on client side JSON Model

Dec 19, 2016 at 03:12 AM

717

avatar image
Former Member

Hi Experts,

I have a JSON model that is bound to a sap.m.Table. I am trying to filter data based on a column "Date" (bound to property[CreatedOn] of the model) which the service returns in the JSON Object Format ("/Date(timeStamp)"). The table is as below:

sample Date from server:

I am trying to filter the table on the client side but I am not sure on how to implement date filters on the client side. The date displayed are formatted based on

sap.ui.model.type.Date({pattern: 'dd/MM/YYYY'})

The filtering code looks as below:

var fromD = this.getView().byId("idKMFilterPaneDocDateF").getValue() ? new Date(this.getView().byId("idKMFilterPaneDocDateF").getValue()) :
  undefined;

var dtFilter = new sap.ui.model.Filter({
  path: "CreatedOn",
  operator: "EQ",
  value1: "dateTime'" + fromD.toJSON() + "'"
});

var binding = oTable.getBinding("items");
binding.filter([filter], "Application");
binding.refresh();

When I execute the above code, I always get "NO Data". I need to implement the "BT" filters as well based on user selection criteria but can't get it to work with "EQ" itself.

Any ideas are appreciated.

Thanks & Regards,

Deepak

sapmtable.png (56.3 kB)
dt.png (3.4 kB)
10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

3 Answers

Best Answer
Abhi S Dec 19, 2016 at 05:22 AM
1

Hi Deepak,

You can try creating a custom sorter for dates. It should work as per your requirement. Thanks!

Regards

~Abhi

Show 1 Share
10 |10000 characters needed characters left characters exceeded
Former Member

Thanks Abhi,

Could you point me to an example I can refer to. Also, Shoudn'tI be writing a custom Filter rather than a sorter(since I need to filter out values between 2 dates).

Best Regards,

Deepak

0
Abhishek Sharma Jan 04, 2017 at 06:39 PM
0

Hi Deepak,

Please have look to below details. although this is not implemented for Table and Date field ... but you may give it a try...

<headerToolbar>
	<Toolbar>
	<Title text="Available Products"/><ToolbarSpacer/><SearchField width="50%" search="onFilterProducts"/>
	</Toolbar>
</headerToolbar>

Where "onFilterProducts" is method which will get called when you click on search button in search field.

sap.ui.define([
                "sap/ui/core/mvc/Controller",
                "sap/ui/model/Filter",
                "sap/ui/model/FilterOperator" 
], function(Controller, Filter, FilterOperator) {
"use strict";
return Controller.extend("SAPOpenCourse.com.controller.View1", {
onFilterProducts : function(oEvent){
var aFilter = [],
 sQuery = oEvent.getParameter("query"),
 oList = this.getView().byId("lstProducts"),
  oBinding = oList.getBinding("items");
 if(sQuery)
{
   aFilter.push(new Filter("ProductID", FilterOperator.Contains, sQuery));
}
 oBinding.filter(aFilter);
 },
});
});

You can use FilterOperator.BT in place of FilterOperator.Contains.

Hope this will help.

Thanks-

Abhishek

Share
10 |10000 characters needed characters left characters exceeded
Jun Wu Jan 05, 2017 at 01:56 AM
0

what if you assign date directly. value1: fromD

Share
10 |10000 characters needed characters left characters exceeded
Skip to Content