Grouping Tile view in PhoneJS - phonejs

Question

I am trying to show products from database into tileview item in devexpress phonejs. Successfully I can load items from datasource into tileview but I would like to group items by the category name and really dont have any idea howto do it. Any help will be appreciated.
JS Code
return {
sale: sale,
departmansSource: {
store: PosApplication.db.Departmans,
select: ["DepartmanID", "DepartmanName"]
},
categoriesSource: {
store: PosApplication.db.Categories,
select: ["CategoryID", "CategoryName"]
},
productsSource: {
store: PosApplication.db.Products,
filter: ["DepartmanID","=", 2],
select: ["ProductID", "ProductName", "DepartmanID", "DepartmanName", "CategoryID", "CategoryName"]
},
approversSource: {
store: PosApplication.db.Approvers,
select: ["ApproverId", "ApproverName"]
},
handleSave: handleSave,
handleCancel: handleCancel,
viewShown: handleViewShown,
notifiy: notifiy
};
Html Code
<div id="urunlertile" data-bind="dxTileView: { height: '550', dataSource: productsSource, itemClickAction: notifiy, baseItemHeight: 70, baseItemWidth: 150, itemMargin: 3, }">
<div data-options="dxTemplate:{name:'item'}">
<p><span data-bind="text: $data.CategoryName"></span></p>
<p><span data-bind="text: $data.ProductName"></span></p>
</div>
</div>
</div>

Answer 1

You can use postProcess callback to group/sort data in your dataSource.
See doc with example:
http://js.devexpress.com/Documentation/Howto/Data_Layer/Data_Layer?version=14_1#Data_Layer_Data_Layer_Reading_Data_Data_Transformation_Post_Processing
Note that dxTileView doesn't support displaying grouped data out of box. Having grouped data like
[{ key: "Category1", items: [{ name: "Product1" }, ...], ...]
you could put nested dxTileView in item template to display products for each category.