PDA

View Full Version : [CLOSED] Feature Grouping



Akpenob
Apr 19, 2013, 9:02 AM
Hello Members

i was wondering if its posible to make a grid that has a grouping feature to group only by a date and not a datetime.

I am trying to make a grid thats displays events and i would like to group them by what date the event/s occurs

I am using a DateColumn to handle the formating of the date.
Does a grouping feature uses the data before the conversion occurs and thous the grouping i done by the datetime and not the format in the datecolumn.

Regards

Akpenob

Daniil
Apr 19, 2013, 9:18 AM
Hi @Akpenob,

The data is grouped at a Store level, i.e. by a ModelField. So, you have to provide respective data on a Store level.

Akpenob
Apr 19, 2013, 9:59 AM
Hi @Akpenob,

The data is grouped at a Store level, i.e. by a ModelField. So, you have to provide respective data on a Store level.

Thanks for the quick respones.

i have sat up a modelField like this..

First this is calledd




switch (i.DateField)
{
case LiaUICtrlDateType.DATETIME:
AddDateFieldColumn(i, "dd-mm- HH:i");
break;
case LiaUICtrlDateType.DATETIMESEC:
AddDateFieldColumn(i, "dd-m-Y HH:i:ss");
break;
case LiaUICtrlDateType.DATE:
AddDateFieldColumn(i, "dd-m-Y");
break;
case LiaUICtrlDateType.TIME:
AddDateFieldColumn(i,"HH:m");
break;
}



The mehod AddDateFieldColumn



public void AddDateFieldColumn(LiaGridLayoutItem item,String dateFormat)
{
AddStoreField(new ModelField(item.RField, ModelFieldType.Date, dateFormat));

DateColumn col = new DateColumn() { DataIndex = item.RField, Text = item.Label, Width = item.Width, Hidden = item.Hidden };
col.Format = dateFormat;
col.MenuDisabled = true;
col.Align = Alignment.Left;
col.Sortable = item.Sortable;
col.Text = _liaBase.Translate.GetText("Columns", item.RField, item.Label);
col.CustomConfig.Add(new ConfigItem("type", ModelFieldType.Date.ToString(), ParameterMode.Value));
col.CustomConfig.Add(new ConfigItem("filterable", Convert.ToString(item.Filterable).ToLower(), ParameterMode.Value));
this.ColumnModel.Columns.Add(col);
}




The method AddStoreField




public void AddStoreField(ModelField field)
{
if (_gridType != LiaGridType.PAGING_GRID && _gridType != LiaGridType.DRAG_DROP_GRID)
{
dataStore.Model[0].Fields.Add(field);
return;
}
liaStore.model.Fields.Add(field);
}



And on the grid this method is called




public void AddGrouping(String GroupField, bool StartCollapsed)
{
if (_gridType == LiaGridType.PAGING_GRID) return;

this.dataStore.GroupField = GroupField;

Grouping grp = new Grouping
{
ID = this.ID + "_Grouping",
HideGroupedHeader = true,
StartCollapsed = StartCollapsed,
GroupHeaderTplString = "{name} ({[values.rows.length]} {[values.rows.length > 1 ? 'Items' : 'Item']})"
};

grp.CustomConfig.Add(new ConfigItem("locStartCollapsed", StartCollapsed ? "collapse" : "", ParameterMode.Value));

this.Features.Add(grp);
}



As you can see i have setup both the ModelField and added the grouping field but still i cant make group by the dateformat.

any suggestion to what i could do...

Regards

Akpenob

Daniil
Apr 19, 2013, 12:04 PM
It is difficult to follow your code snippets and understand what you should do.

We should start with a simple example. The example below groups by dates with success.

Could you modify it to reproduce the problem that you are facing?

Example

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
DateTime now = DateTime.Today;
DateTime nowPlusOne = now.AddDays(1);

Store store = this.GridPanel1.GetStore();
store.DataSource = new object[]
{
new object[] { now, "1", "1" },
new object[] { now, "11", "11" },
new object[] { now, "111", "111" },
new object[] { nowPlusOne, "2", "2" },
new object[] { nowPlusOne, "22", "22" },
new object[] { nowPlusOne, "222", "222" }
};
store.DataBind();
}
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:GridPanel ID="GridPanel1" runat="server">
<Store>
<ext:Store runat="server" GroupField="date">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="date" Type="Date" />
<ext:ModelField Name="test1" />
<ext:ModelField Name="test2" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:DateColumn runat="server" Text="Date" DataIndex="date" />
<ext:Column runat="server" Text="Test1" DataIndex="test1" />
<ext:Column runat="server" Text="Test2" DataIndex="test2" />
</Columns>
</ColumnModel>
<Features>
<ext:Grouping runat="server" />
</Features>
</ext:GridPanel>
</form>
</body>
</html>

Akpenob
Apr 26, 2013, 5:46 PM
This is an great exsample and it shows how i could group them by date.

But my problem is not that i cant group the a DateTime.

No Problem is like this..

I get a set of dates back from the db with time in them

Ex.

1 date = 2012-04-19 : 12:22:22
2 date = 2012-04-19 : 14:00:00
3 date = 2012-04-19 : 16:35:00

4 date = 2012-04-21 : 05:35:37

And so on..

is there a way for me to group this values without each of them makes a group by them self..?

Regards

Akpenob

Daniil
Apr 29, 2013, 5:51 AM
You can define an additional ModelField with a field to group by. Its source can be an existing date/time field which you can clear time in a Convert handler.

Example

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
DateTime now = DateTime.Today;
DateTime nowPlusOne = now.AddDays(1);

Store store = this.GridPanel1.GetStore();
store.DataSource = new object[]
{
new object[] { now, "1", "1" },
new object[] { now.AddHours(1), "11", "11" },
new object[] { now.AddHours(2), "111", "111" },
new object[] { nowPlusOne.AddHours(1), "2", "2" },
new object[] { nowPlusOne.AddHours(2), "22", "22" },
new object[] { nowPlusOne, "222", "222" }
};
store.DataBind();
}
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:GridPanel ID="GridPanel1" runat="server">
<Store>
<ext:Store runat="server" GroupField="date">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="dateAndTime" Type="Date" />
<ext:ModelField Name="test1" />
<ext:ModelField Name="test2" />
<ext:ModelField Name="date" Type="Date">
<Convert Handler="return Ext.Date.clearTime(record.data.dateAndTime);" />
</ext:ModelField>
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:DateColumn
runat="server"
Text="Date"
DataIndex="dateAndTime"
Format="yyyy/MM/dd HH:mm" />

<ext:Column runat="server" Text="Test1" DataIndex="test1" />

<ext:Column runat="server" Text="Test2" DataIndex="test2" />
</Columns>
</ColumnModel>
<Features>
<ext:Grouping
runat="server"
HideGroupedHeader="true"
GroupHeaderTplString="{name:date('y/m/d')}" />
</Features>
</ext:GridPanel>
</form>
</body>
</html>