DevExpress Asp.net(7) ASPxTreeList的基本使用之一
2009-07-25 09:57
549 查看
此事例主要说明了ASPxTreeList的一些基本使用
1 数据绑定
2 数据导出
3 分页设置
4 用户弹出面板设置
5 样式设置
6 ShowPreview
8 数据模板
9 选择事件
10 数据统计
绑定绑定
ASPxTreeList其他数据绑定一样,可用各种类型的数据源。但因为要显示树形结构,
所以除了DataSourceID必须进行设置以外,还得必须设置KeyFieldName与ParentFieldName,
KeyFieldName与ParentFieldName就是主、子的关系,用于创建树形结构。
同时可以指定在ASPxTreeList默认展开的级数,代码如下:
this.ASPxTreeList1.ExpandToLevel(2); //展开2级
数据导出
关于ASPxTreeList数据导出,DevExpress同样为我们提供了解决方案,即ASPxTreeListExporter,
数据导出组件。
ASPxTreeListExproter的用法非常简单,但同时提供了3种文件格式的导出方案,xls|pdf|rft
使用方法:
1 向有ASPxTreeList数据的面页添加ASPxTreeListExporter,并设置Exporter的TreeListID属
性,即导出哪一个ASPxTreeList.默认不指定的情况下会导出页面中第一个ASPxTreeList,但
当有多个时并希望导出指定ASPxTreeList时,则必须指定。
2 指定ASPxTreeListExporter的导出方法,格式文件格式和导出策略不同,ASPxTreeListExporter
提供了以下方法:
void WritePdf(Stream stream);
void WritePdfToResponse();
void WriteRtf(Stream stream);
void WriteRtfToResponse();
void WriteXls(Stream stream);
void WriteXlsToResponse();
每个方法都有多个重载,可权限需要进行调用。另外需要说明的是,如果ASPxTreeList设置的分页
功能,调用以下方法时可能出现只导出当前面的现象,所以调用以上方法进,可以设置导出的详细
设置,如下:
ASPxTreeListExporter.Settings.ExpandAllNodes = true;
ASPxTreeListExporter.Settings.ExportAllPages = true;
ASPxTreeListExporter.Settings.ShowTreeButtons = true;
分面设置
默认情况下,ASPxTreeList不进行分页处理,如果需要分面功能,可以设置其属性SettingsPager
如下代码:
<SettingsPager AlwaysShowPager="True" Mode="ShowPager">
</SettingsPager>
默认页大小为10,可以通过SettingPager的 PageSize属性设置,PageSize="20"
用户弹出面板设置
即让用户自定义ASPxTreeList显示的字段名称,如下设置
<SettingsCustomizationWindow Enabled="True" />
如果当某一字段在初始时设置Visible=false,那么此字段将会放在CustomizationWindow中,
当然,用户也可以把它拖放出来,也可以拖放进去。以下代码就是控制如果显示与隐藏
CustomizationWindow.
treeList.ShowCustomizationWindow(); //ClientInstanceName="treeList"
treeList.HideCustomizationWindow();
样式设置
样式设置最基本就是设置边框样式、页脚、tree线等。如下
<Settings GridLines="Both"
ShowFooter="True"
ShowGroupFooter="True"
ShowPreview="True" />
ShowPreview
可显示数据内容较多的View,不影响TreeList的展示。
1 设置ASPxTreeList的PreviewFieldName="Location"
2 <Settings ShowPreview="True" />
数据模板
<Templates>
<DataCell>
<%# Eval("Common_Name") %>
</DataCell>
</Templates>
选择事件
可添加treelist的FocuseNodeChnaged事件来处理选择Node时的逻辑,但ASPxTreeList必须
设置AllowFocusedNode=true,如下:
<SettingsBehavior AllowFocusedNode="True" />
通过FocuseNodeChnaged事件来回调整ASPxTreeList的服务端事件来完成通信,发下:
<ClientSideEvents CustomDataCallback="function(s, e) {
alert(e.result);
}" FocusedNodeChanged="function(s, e) {
var key = treeList.GetFocusedNodeKey();
treeList.PerformCustomDataCallback(key);
}" />
以下代码设置为可多选,并且可以递归选择。
<SettingsSelection Enabled="True" Recursive="True" />
数据统计
<Summary>
<dxwtl:TreeListSummaryItem
DisplayFormat="Count={0}" //显示格式
FieldName="Department" //数据统计字段
ShowInColumn="Department" //显示的位置字段
SummaryType="Count" /> //统计类型
<dxwtl:TreeListSummaryItem DisplayFormat="Sum={0:C}" FieldName="Budget"
ShowInColumn="Budget" SummaryType="Sum" />
</Summary>
ASPxTreeList的数据统计显示与ASPxGridview基本相同。
代码:
HTML:
C#代码:
1 数据绑定
2 数据导出
3 分页设置
4 用户弹出面板设置
5 样式设置
6 ShowPreview
8 数据模板
9 选择事件
10 数据统计
绑定绑定
ASPxTreeList其他数据绑定一样,可用各种类型的数据源。但因为要显示树形结构,
所以除了DataSourceID必须进行设置以外,还得必须设置KeyFieldName与ParentFieldName,
KeyFieldName与ParentFieldName就是主、子的关系,用于创建树形结构。
同时可以指定在ASPxTreeList默认展开的级数,代码如下:
this.ASPxTreeList1.ExpandToLevel(2); //展开2级
数据导出
关于ASPxTreeList数据导出,DevExpress同样为我们提供了解决方案,即ASPxTreeListExporter,
数据导出组件。
ASPxTreeListExproter的用法非常简单,但同时提供了3种文件格式的导出方案,xls|pdf|rft
使用方法:
1 向有ASPxTreeList数据的面页添加ASPxTreeListExporter,并设置Exporter的TreeListID属
性,即导出哪一个ASPxTreeList.默认不指定的情况下会导出页面中第一个ASPxTreeList,但
当有多个时并希望导出指定ASPxTreeList时,则必须指定。
2 指定ASPxTreeListExporter的导出方法,格式文件格式和导出策略不同,ASPxTreeListExporter
提供了以下方法:
void WritePdf(Stream stream);
void WritePdfToResponse();
void WriteRtf(Stream stream);
void WriteRtfToResponse();
void WriteXls(Stream stream);
void WriteXlsToResponse();
每个方法都有多个重载,可权限需要进行调用。另外需要说明的是,如果ASPxTreeList设置的分页
功能,调用以下方法时可能出现只导出当前面的现象,所以调用以上方法进,可以设置导出的详细
设置,如下:
ASPxTreeListExporter.Settings.ExpandAllNodes = true;
ASPxTreeListExporter.Settings.ExportAllPages = true;
ASPxTreeListExporter.Settings.ShowTreeButtons = true;
分面设置
默认情况下,ASPxTreeList不进行分页处理,如果需要分面功能,可以设置其属性SettingsPager
如下代码:
<SettingsPager AlwaysShowPager="True" Mode="ShowPager">
</SettingsPager>
默认页大小为10,可以通过SettingPager的 PageSize属性设置,PageSize="20"
用户弹出面板设置
即让用户自定义ASPxTreeList显示的字段名称,如下设置
<SettingsCustomizationWindow Enabled="True" />
如果当某一字段在初始时设置Visible=false,那么此字段将会放在CustomizationWindow中,
当然,用户也可以把它拖放出来,也可以拖放进去。以下代码就是控制如果显示与隐藏
CustomizationWindow.
treeList.ShowCustomizationWindow(); //ClientInstanceName="treeList"
treeList.HideCustomizationWindow();
样式设置
样式设置最基本就是设置边框样式、页脚、tree线等。如下
<Settings GridLines="Both"
ShowFooter="True"
ShowGroupFooter="True"
ShowPreview="True" />
ShowPreview
可显示数据内容较多的View,不影响TreeList的展示。
1 设置ASPxTreeList的PreviewFieldName="Location"
2 <Settings ShowPreview="True" />
数据模板
<Templates>
<DataCell>
<%# Eval("Common_Name") %>
</DataCell>
</Templates>
选择事件
可添加treelist的FocuseNodeChnaged事件来处理选择Node时的逻辑,但ASPxTreeList必须
设置AllowFocusedNode=true,如下:
<SettingsBehavior AllowFocusedNode="True" />
通过FocuseNodeChnaged事件来回调整ASPxTreeList的服务端事件来完成通信,发下:
<ClientSideEvents CustomDataCallback="function(s, e) {
alert(e.result);
}" FocusedNodeChanged="function(s, e) {
var key = treeList.GetFocusedNodeKey();
treeList.PerformCustomDataCallback(key);
}" />
以下代码设置为可多选,并且可以递归选择。
<SettingsSelection Enabled="True" Recursive="True" />
数据统计
<Summary>
<dxwtl:TreeListSummaryItem
DisplayFormat="Count={0}" //显示格式
FieldName="Department" //数据统计字段
ShowInColumn="Department" //显示的位置字段
SummaryType="Count" /> //统计类型
<dxwtl:TreeListSummaryItem DisplayFormat="Sum={0:C}" FieldName="Budget"
ShowInColumn="Budget" SummaryType="Sum" />
</Summary>
ASPxTreeList的数据统计显示与ASPxGridview基本相同。
代码:
<mce:script type="text/javascript"><!-- function CwShow() { treeList.ShowCustomizationWindow(); btnCustWin.SetText("Hide Customization Window"); } function CwHide() { treeList.HideCustomizationWindow(); btnCustWin.SetText("Show Customization Window"); } function CwToggle() { if (treeList.IsCustomizationWindowVisible()) CwHide(); else CwShow(); } // --></mce:script>
HTML:
<dxe:ASPxButton ID="ASPxButton1" runat="server" OnClick="ASPxButton1_Click" Text="Export to XLS"> </dxe:ASPxButton> <dxe:ASPxButton ID="ASPxButton2" runat="server" OnClick="ASPxButton2_Click" Text="Export to PDF"> </dxe:ASPxButton> <dxe:ASPxButton ID="ASPxButton3" runat="server" AutoPostBack="false" Text="Show Customer Window"> <ClientSideEvents Click="function(s, e) { CwToggle(); }" /> </dxe:ASPxButton> <dxwtl:ASPxTreeListExporter ID="ASPxTreeListExporter1" runat="server" TreeListID="ASPxTreeList2"> </dxwtl:ASPxTreeListExporter> <dxwtl:ASPxTreeList ID="ASPxTreeList1" runat="server" AutoGenerateColumns="False" ClientInstanceName="treeList" DataSourceID="AccessDataSource1" Width="100%" KeyFieldName="ID" ParentFieldName="ParentID" PreviewFieldName="Location" oncustomdatacallback="ASPxTreeList1_CustomDataCallback"> <ClientSideEvents CustomDataCallback="function(s, e) { alert(e.result); }" FocusedNodeChanged="function(s, e) { var key = treeList.GetFocusedNodeKey(); treeList.PerformCustomDataCallback(key); }" /> <Columns> <dxwtl:TreeListTextColumn FieldName="Department" VisibleIndex="1"> </dxwtl:TreeListTextColumn> <dxwtl:TreeListTextColumn FieldName="Budget" VisibleIndex="2" AllowSort="True" SortIndex="0" SortOrder="Ascending"> </dxwtl:TreeListTextColumn> <dxwtl:TreeListTextColumn FieldName="Location" VisibleIndex="3"> </dxwtl:TreeListTextColumn> <dxwtl:TreeListTextColumn FieldName="Phone1" VisibleIndex="4"> </dxwtl:TreeListTextColumn> <dxwtl:TreeListTextColumn FieldName="Phone2" VisibleIndex="5" Visible="false"> </dxwtl:TreeListTextColumn> </Columns> <SettingsSelection Enabled="True" Recursive="True" /> <Summary> <dxwtl:TreeListSummaryItem DisplayFormat="Count={0}" FieldName="Department" ShowInColumn="Department" SummaryType="Count" /> <dxwtl:TreeListSummaryItem DisplayFormat="Sum={0:C}" FieldName="Budget" ShowInColumn="Budget" SummaryType="Sum" /> </Summary> <SettingsPager AlwaysShowPager="True" Mode="ShowPager" PageSize="20"> </SettingsPager> <Settings GridLines="Both" ShowFooter="True" ShowGroupFooter="True" ShowPreview="True" /> <SettingsBehavior ExpandCollapseAction="NodeDblClick" AllowFocusedNode="True" /> <SettingsCustomizationWindow Enabled="True" /> </dxwtl:ASPxTreeList> <asp:AccessDataSource ID="AccessDataSource1" runat="server" DataFile="~/App_Data/DataSources/Departments.mdb" SelectCommand="SELECT * FROM [Departments]" /> <dxwtl:ASPxTreeList ID="ASPxTreeList2" runat="server" AutoGenerateColumns="False" DataSourceID="SiteMapDataSource1"> <SettingsPager AlwaysShowPager="True" ShowSeparators="True" Mode="ShowPager"> </SettingsPager> <Columns> <dxwtl:TreeListTextColumn FieldName="Title" ReadOnly="True" VisibleIndex="1"> </dxwtl:TreeListTextColumn> <dxwtl:TreeListTextColumn FieldName="Url" ReadOnly="True" VisibleIndex="2"> </dxwtl:TreeListTextColumn> <dxwtl:TreeListTextColumn FieldName="Description" ReadOnly="True" VisibleIndex="3"> </dxwtl:TreeListTextColumn> </Columns> </dxwtl:ASPxTreeList> <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
C#代码:
{ if (!IsPostBack) { DataBind(); this.ASPxTreeList1.ExpandToLevel(2); } } // 导出xls protected void ASPxButton1_Click(object sender, EventArgs e) { ASPxTreeListExporter1.WriteXlsToResponse(); } //导出pdf protected void ASPxButton2_Click(object sender, EventArgs e) { ASPxTreeListExporter1.Settings.ExpandAllNodes = true; ASPxTreeListExporter1.Settings.ExportAllPages = true; ASPxTreeListExporter1.Settings.ShowTreeButtons = true; ASPxTreeListExporter1.WritePdfToResponse(); } protected void ASPxTreeList1_CustomDataCallback(object sender, DevExpress.Web.ASPxTreeList.TreeListCustomDataCallbackEventArgs e) { e.Result = "Key=" + e.Argument; }
相关文章推荐
- DevExpress Asp.net(7) ASPxTreeList的基本使用之一
- DevExpress Asp.net ASPxTreeList的基本使用之一
- DevExpress Asp.net(8) ASPxTreeList的基本使用之二
- DevExpress Asp.net ASPxTreeList的基本使用之一
- DevExpress ASP.NET 使用经验谈(7)-ASPxTreeList控件使用
- DevExpress Asp.net(9) ASPxHiddenField的特性与基本使用
- DevExpress Asp.net(1) ASPxButton的基本使用
- DevExpress Asp.net(5) ASPxCloudControl的基本使用
- Devexpress ASP.NET中ASPxTreeList节点的拖动
- DevExpress ASP.NET 使用经验谈(8)-ASPxGridView自定义列和基本事件
- DevExpress Asp.net(4) ASPxCallbackPanel的基本使用
- DevExpress Asp.net(6) ASPxLoadingPanel的基本使用
- DevExpress Asp.net(5) ASPxCloudControl的基本使用
- DevExpress Asp.net(4) ASPxCallbackPanel的基本使用
- DevExpress Asp.net(9) ASPxHiddenField的特性与基本使用
- DevExpress Asp.net(6) ASPxLoadingPanel的基本使用
- .net ASPxTreeList 使用手记
- 【DevExpress v17.2新功能预告】增强ASP.NET TreeList
- DevExpress ASP.NET ASPxGridView使用方法大全
- DevExpress控件使用系列--ASPxTreeList