没有找到合适的产品?
联系客服协助选型:023-68661681
提供3000多款全球软件/控件产品
针对软件研发的各个阶段提供专业培训与技术咨询
根据客户需求提供定制化的软件开发服务
全球知名设计软件,显著提升设计质量
打造以经营为中心,实现生产过程透明化管理
帮助企业合理产能分配,提高资源利用率
快速打造数字化生产线,实现全流程追溯
生产过程精准追溯,满足企业合规要求
以六西格玛为理论基础,实现产品质量全数字化管理
通过大屏电子看板,实现车间透明化管理
对设备进行全生命周期管理,提高设备综合利用率
实现设备数据的实时采集与监控
利用数字化技术提升油气勘探的效率和成功率
钻井计划优化、实时监控和风险评估
提供业务洞察与决策支持实现数据驱动决策
                
            原创|其它|编辑:郝浩|2009-09-24 09:35:34.000|阅读 975 次
概述:前一段时间发了一篇文章基于ExtAspNet的开源项目 - Ext4JSLint,这个东东也算是我拿ExtAspNet做的第一个小应用。还是有一些应用方面的技巧,接下来的几篇文章就和大家分享一下。
# 界面/图表报表/文档/IDE等千款热门软控件火热销售中 >>
引子 
前一段时间发了一篇文章,这个东东也算是我拿ExtAspNet做的第一个小应用。还是有一些应用方面的技巧,接下来的几篇文章就和大家分享一下。 
Ext4JSLint是使用来展示的结果。 
JSLint-Toolkit是一个使用Rhino和JSLint的小项目,可以对一个文件夹中的所有JavaScript进行语法检查,并显示友好的检查结果。 
我曾写了来介绍。 
界面截图 
 
整体来看,整个页面被分成四个部分:
ASPX标签定义
01.<ext:PageManager AutoSizePanelID="BorderLayout1" runat="server"></ext:PageManager> 02.<ext:BorderLayout ID="BorderLayout1" ShowBorder="false" runat="server"> 03.    <Regions> 04.        <ext:Region ID="Region1" Height="60px" ShowBorder="false" ShowHeader="false"05.            Position="Top" Layout="Fit" runat="server"> 06.            <Toolbars> 07.                <ext:Toolbar ID="Toolbar1" Position="Bottom" runat="server"> 08.                    <Items> 09.                        <ext:Button ID="btnExpandAll" IconUrl="~/images/expand-all.gif" Text="Expand All"10.                            EnablePostBack="false" runat="server"> 11.                        </ext:Button> 12.                        <ext:Button ID="btnCollapseAll" IconUrl="~/images/collapse-all.gif" Text="Collapse All"13.                            EnablePostBack="false" runat="server"> 14.                        </ext:Button> 15.                        <ext:ToolbarSeparator ID="ToolbarSeparator1" runat="server"> 16.                        </ext:ToolbarSeparator> 17.                        <ext:Button ID="btnCriticalErrors" IconUrl="~/images/exclamation.png" Text="Only Critical Errors"18.                            OnClick="btnCriticalErrors_Click" EnablePress="true" runat="server"> 19.                        </ext:Button> 20.                    </Items> 21.                </ext:Toolbar> 22.            </Toolbars> 23.            <Items> 24.                <ext:ContentPanel ShowBorder="false" ShowHeader="false" BodyStyle="background-color:#1C3E7E;"25.                    ID="ContentPanel1" runat="server"> 26.                    <div style="font-size: 20px; color:White; font-weight:bold; padding: 3px 10px; "> 27.                        <a href="./default.aspx" style="color:White;">Ext4JSLint</a> 28.                    </div> 29.                </ext:ContentPanel> 30.            </Items> 31.        </ext:Region> 32.        <ext:Region ID="regionLeft" Split="true" Width="200px" ShowHeader="false" EnableCollapse="true"33.            Layout="Fit" Position="Left" runat="server"> 34.            <Items> 35.                <ext:Tree runat="server" ID="Tree1" ShowBorder="false" ShowHeader="false" AutoScroll="true"36.                    EnableArrows="true" OnNodeCommand="Tree1_NodeCommand"> 37.                </ext:Tree> 38.            </Items> 39.        </ext:Region> 40.        <ext:Region ID="regionCenter" ShowHeader="false" Position="Center" Layout="Fit" runat="server"> 41.            <Items> 42.                <ext:Grid ID="Grid1" runat="server" ShowBorder="false" ShowHeader="false" EnableCheckBoxSelect="false"43.                    EnableRowNumber="false" EnableMultiSelect="false" OnRowDataBound="Grid1_RowDataBound"44.                    OnPreRowDataBound="Grid1_PreRowDataBound" Title="Grid"> 45.                    <Columns> 46.                        <ext:BoundField DataField="line" Width="45px" HeaderText="Line" /> 47.                        <ext:BoundField DataField="reason" ExpandUnusedSpace="true" HeaderText="Reason" /> 48.                    </Columns> 49.                </ext:Grid> 50.            </Items> 51.        </ext:Region> 52.        <ext:Region ID="regionRight" ShowHeader="false" Split="true" IFrameUrl="./source.htm"53.            EnableIFrame="true" IFrameName="main" Position="Right" Width="400px" runat="server"> 54.        </ext:Region> 55.    </Regions> 56.</ext:BorderLayout> 
经过前几篇文章对的介绍,相信大家对这段ASPX标签的声明并不陌生。 
如果你对这里的标签不熟悉,可以参考这一篇文章: 
展开全部与折叠全部 
在以上标签声明中,大家应该注意到btnExpandAll和btnCollapseAll两个按钮都定义了属性EnablePostBack="false",也就是说点击这两个按钮不会产生PostBack事件。 
我们需要在客户端使用JavaScript完成这一任务。 
---------------慢,你不是号称“No JavaScript”么? 
是的,这个任务也完全可以回发页面来更新左侧树,因为整个过程是AJAX的所以用户体验也很好。 
我们这里只是提供实现问题的另一个途径,因为不需要服务器交互时,JavaScript实现的效果更好。 
来看下JavaScript的定义:
01.function onReady() { 02.    expandCollapseTree(); 03.} 04.function expandCollapseTree() { 05.    var tree = Ext.getCmp("<%= Tree1.ClientID %>"); 06.    var btnExpandAll = Ext.getCmp("<%= btnExpandAll.ClientID %>"); 07.    btnExpandAll.on("click", function() { 08.        tree.expandAll(); 09.    }); 10.    var btnCollapseAll = Ext.getCmp("<%= btnCollapseAll.ClientID %>"); 11.    btnCollapseAll.on("click", function() { 12.        tree.collapseAll(); 13.    }); 14.} 
其中onReady函数是ExtAspNet的一个命名约定,以这个名称命名的函数会在页面加载完成后执行,我们可以看到页面源代码中有相关定义: 
 
Ext.getCmp函数是extjs中定义的,用于由节点ID获取此节点表示的extjs组件,同样expandAll和collapseAll是树示例的方法,这也是在extjs中定义的。 
ExtAspNet帮帮忙,我不想写JavaScript! 
------No Problem! 
注:这一小节的内容需要ExtAspNet版本大于 v2.1.1,目前可以从下载最新版本并编译。 
不想写JavaScript,而又想实现在客户端折叠和展开所有树的节点(我可不想因为这个简单的功能来回发页面),好办:
01.protected void Page_Load(object sender, EventArgs e) 02.{ 03.    if (!IsPostBack) 04.    { 05.        LoadData(true); 06.    } 07.} 08.private void LoadData(bool showAllErrors) 09.{ 10.    btnExpandAll.OnClientClick = Tree1.GetExpandAllNodesReference(); 11.    btnCollapseAll.OnClientClick = Tree1.GetCollapseAllNodesReference(); 12.} 
是不是很简单,两句C#代码就把那么长一段JavaScript搞定。 
其实这并不神秘,只是ExtAspNet帮你完成了手工写JavaScript代码的任务,看下HTML源代码你就明白了: 
 
下一章将讲述怎么由JSON文件生成左侧树控件。 
本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@ldacury.cn
文章转载自:博客园



					接DevExpress原厂商通知,将于近日上调旗下产品授权价格,现在下单客户可享受优惠报价!
					面对“数字中国”建设和中国制造2025战略实施的机遇期,中车信息公司紧跟时代的步伐,以“集约化、专业化、标准化、精益化、一体化、平台化”为工作目标,大力推进信息服务、工业软件等核心产品及业务的发展。在慧都3D解决方案的实施下,清软英泰建成了多模型来源的综合轻量化显示平台、实现文件不失真的百倍压缩比、针对模型中的大模型文件,在展示平台上进行流畅展示,提升工作效率,优化了使用体验。
					本站的模型资源均免费下载,登录后即可下载。模型仅供学习交流,勿做商业用途。
					本站的模型资源均免费下载,登录后即可下载。模型仅供学习交流,勿做商业用途。
服务电话
重庆/ 023-68661681
华东/ 13452821722
华南/ 18100878085
华北/ 17347785263
客户支持
技术支持咨询服务
服务热线:400-700-1020
邮箱:sales@ldacury.cn
关注我们
地址 : 重庆市九龙坡区火炬大道69号6幢
                
            
靠谱朗驰娱乐体育