DevExpress Asp.net控件使用

下面这个例子将说明如何通过客户端启用服务器端的方法来更新DIV中的数据。

HTML代码三个DIV，每个DIV分别有一个<a/>标签，通过调用Javascript函数ShowDetails来更新DIV的内容，其中参数为Div ID的最后一个数字。ASPxCallback组件同时注册服务器的OnCallback事件，用来处理回调时处理，ClientSideEvents的 CallbackComplete方法当回调完成时将自动调用。JS，通过Callback1.PerformCallback(id)调用服务器的OnCallback事件

HTML：

C#，在OnCallback事件中接受客户端传递过来的参数，以进行判断是更新的哪一个DIV，并通过e.Result返回处理后的结果：

最后，Aspx系列控件的所有的客户端回调都是通过这种模块完成的，如设置Aspx的ClientInstanceName属性，添加注册Aspx服务器端的Callback方法，在客户端调用Aspx的PerformCallback()方法等。这种模式在以后的使用过程中会经常的见到。

DevExpress Asp.net(4) ASPxCallbackPanel的基本使用

DevExpress Asp.net(7) ASPxTreeList的基本使用之一

ASPxTreeList是结合了Tree控件与GridView控件,不仅可以显示树形结构视图,而且可以还编辑/删除/统计等制作,以下只是进行了一些基本的AspxTreeList操作的总结.此事例主要说明了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" />       

 演示代码:

Js:

HTML: