Coolite Toolkit里的Menu控件和其他的.NET Web控件不一样,如果只是设计好了Menu或是通过程序初始化菜单项,菜单是不会呈现在界面上的,因为Coolite Toolkit规定Menu控件需要一个容器来做依托,而这个让Menu依托的控件就是MenuPanel,下面拖拽出的MenuPanel控件所生成的html编码:

Code
<ext:MenuPanel ID="MenuPanel1" runat="server" Height="300" Title="Menu" Width="185">
    <Menu>
        <Items>
            <ext:MenuItem ID="MenuItem1" runat="server" Text="Item1">
                <Menu>
                    <ext:Menu ID="Menu2" runat="server">
                        <Items>
                            <ext:MenuItem ID="MenuItem2" runat="server" Text="SubItem1">
                            </ext:MenuItem>
                            <ext:MenuItem ID="MenuItem3" runat="server" Text="SubItem2">
                            </ext:MenuItem>
                        </Items>
                    </ext:Menu>
                </Menu>
            </ext:MenuItem>
            <ext:MenuItem ID="MenuItem4" runat="server" Text="Item2">
            </ext:MenuItem>
            <ext:MenuItem ID="MenuItem5" runat="server" Text="Item3">
            </ext:MenuItem>
            <ext:MenuItem ID="MenuItem6" runat="server" Text="Item4">
            </ext:MenuItem>
        </Items>
    </Menu>
</ext:MenuPanel>

从上面可以明显的看出,MenuPanel里可以放置菜单项(MenuItem),如果有子菜单,那么子菜单则对应于一个Menu控件,子菜单里的菜单项则又是通过菜单项(MenuItem)来体现。如下是我修改后的一个菜单html编码:

<ext:MenuPanel runat="server" Height="300" Title="帐套管理" Width="185">
    <Menu runat="server">
        <Items>
            <ext:MenuItem runat="server" Text="新增帐套" Icon="Add">
                <Listeners>
                    <Click Handler="JavaScript:window.location.href='#';" />
                </Listeners>
            </ext:MenuItem>
            <ext:MenuItem runat="server" Text="维护帐套" Icon="Cmy"/>
            <ext:MenuItem runat="server" Text="帐套管理" Icon="Database">
                <Menu>
                    <ext:Menu runat="server">
                        <Items>
                            <ext:MenuItem  runat="server" Text="备份帐套" Icon="DatabaseSave">
                                <Listeners>
                                    <Click Handler="JavaScript:window.open('#');" />
                                </Listeners>
                            </ext:MenuItem>
                            <ext:MenuItem runat="server" Text="恢复帐套" Icon="DatabaseGo">
                                <Listeners>
                                    <Click Handler="JavaScript:window.open('#');" />
                                </Listeners>
                            </ext:MenuItem>
                        </Items>
                    </ext:Menu>
                </Menu>
            </ext:MenuItem>
        </Items>
        <Listeners>
            <ItemClick Fn="onItemClick" />
        </Listeners>
    </Menu>
</ext:MenuPanel>
<script type="text/javascript">
    function onItemClick(menuItem) {
        Ext.Msg.alert("★操作提示★", "当前点击项内容:" + menuItem.text);
    }
 </script>

像Tree、Menu等类似的控件,我个人认为主要就是弄清楚他们内部的层次结构,不管是通过界面设计还是通过直接Code创建他们,最终得到的结果都是一样,如上菜单显示效果,同样可以通过如下程序代码来创建:

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        CreateMenuPanel();
    }
}

private void CreateMenuPanel()
{
    MenuPanel menuPanel = new MenuPanel();
    menuPanel.Title = "帐套管理";
    menuPanel.Width = new Unit(180);

Coolite.Ext.Web.MenuItem addAccount = new Coolite.Ext.Web.MenuItem("新增帐套");
    addAccount.Icon = Icon.Add;
    addAccount.Listeners.Click.Handler = "JavaScript:window.location.href='#';";
    
    Coolite.Ext.Web.MenuItem whAccount = new Coolite.Ext.Web.MenuItem("维护帐套");
    whAccount.Icon=Icon.Cmy;

Coolite.Ext.Web.MenuItem accountManage = new Coolite.Ext.Web.MenuItem("帐套管理");
    accountManage.Icon = Icon.Database;

Coolite.Ext.Web.Menu subMenu = new Coolite.Ext.Web.Menu();

Coolite.Ext.Web.MenuItem backMenuItem = new Coolite.Ext.Web.MenuItem("备份帐套");
    backMenuItem.Icon = Icon.DatabaseSave;
    backMenuItem.Listeners.Click.Handler = "JavaScript:window.open('#')";
    subMenu.Items.Add(backMenuItem);

Coolite.Ext.Web.MenuItem reMenuItem = new Coolite.Ext.Web.MenuItem("恢复帐套");
    reMenuItem.Icon = Icon.DatabaseGo;
    reMenuItem.Listeners.Click.Handler = "JavaScript:window.open('#')";
    subMenu.Items.Add(reMenuItem);

accountManage.Menu.Add(subMenu);

menuPanel.Menu.Items.Add(addAccount);
    menuPanel.Menu.Items.Add(whAccount);
    menuPanel.Menu.Items.Add(accountManage);
    menuPanel.Menu.Listeners.ItemClick.Fn = "onItemClick";

accountDiv.Controls.Add(menuPanel);
}

本笔记暂时记录于此,更多高级应用需要大家去挖掘,欢迎各位朋友留下自己的看法和使用心得。

转载于:https://www.cnblogs.com/AndySong/archive/2009/10/31/1593615.html

Coolite Toolkit学习笔记五:常用控件Menu和MenuPanel相关推荐

  1. Qt学习笔记之常用控件QlistWidget

    一.QListWidget Class The QListWidget class provides an item-based list widget. More... Header: #inclu ...

  2. 【MFC】学习笔记:常用控件之组合框(Combo Box)

    01.目录 目录 01.目录 02.控件介绍 03.控件的消息通知函数 04.创建组合框控件及成员函数介绍 4.1 组合框的创建 4.2 CComboBox类的主要成员函数 05.应用实例 06.总结 ...

  3. Qt学习笔记之常用控件QTreeWidget

    一.QTreeWidget Class The QTreeWidget class provides a tree view that uses a predefined tree model. Mo ...

  4. Coolite Toolkit学习笔记系列文章

    Coolite Toolkit 是一个支持ASP.NET AJAX的Web控件.它是基于跨浏览器的ExtJS 库开发而来的,并且简化了开发步骤,并且包含有丰富的Ajax运用,同ExtJS 一样都是开源 ...

  5. Coolite Toolkit学习笔记九:表单布局控件FormLayout与FromPanel

    FormLayout在我们平时开发中使用频率非常高,使用它可快速.方便的实现表单界面布局,以及使用一些其他控件自身的特性组合起来实现丰富强大的UI界面.下面通过一个简单示例来体验FormLayout的 ...

  6. Coolite Toolkit学习笔记六:常用控件Accordion、ToolBar、ToolTip

    一.Accordion控件      Accordion的功能非常适用,使用很简单,轻轻松松的就可以构建一个可折叠的界面展示应用效果.相信大多数做ASP.NET开发的朋友都使用过ASP.NET AJA ...

  7. Coolite Toolkit学习笔记三:基本控件之Button、TextField、DataField、ComboBox

    Button.TextField.DataField.ComBox这些控件好象也没什么好学的,任何一个学过ASP.NET的朋友都应该会使用这些控件,Coolite Toolkit里的这些控件相比标准的 ...

  8. Coolite Toolkit学习笔记八:常用控件TabPanel

    TabPanel控件使用非常简单,但是功能却非常强大,它同MenuPanel.TreePanel一样提供了很多的集合属性,可以定制出丰富的应用.其中用得最多的就是他的Tabs属性,用于定义子标签选项, ...

  9. Coolite Toolkit学习笔记一:AjaxEvent、AjaxMethod和Listeners

    一:AjaxEvent      Coolite Toolkit所提供的AjaxEvent可以应用在很多的控件中,实现异步提交等相关功能.比如使用在Coolite Toolkit的Button控件中, ...

最新文章

  1. 2021-2027年中国市医疗电子场投资分析及前景预测报告
  2. 计算距离torch.nn.PairwiseDistance
  3. MFC接收命令行参数的三种方法
  4. html php 混编 H1,在一个HTML中h1标签能出现几次?h1标签和标题标签的差别是什么?...
  5. 含有参数的sql拼接_关于SQL语句参数中为多个带.字符串。
  6. 彻底理解Python中的yield
  7. 要害怕做事的s9t9
  8. 深度学习界明星:生成对抗网络与Improving GAN
  9. linux系统权限和用户
  10. 9.数据操作 数据收集器
  11. Swift - iCloud存储介绍
  12. 【数据库设计】假设每个学生选修若干门课程,且每个学生每选一门课只有一个成绩,每个教师只担任一门课的教学,一门课由若干教师任教。画出E-R图
  13. Linux可以打开cdr文件吗,CDR是什么格式
  14. Docer容器的介绍(一)-------Docker基本概念和框架
  15. Spring源码系列(十三)——Spring源码编译及详细注解
  16. PWM呼吸灯之三角波、锯齿波、正弦函数波
  17. 疫情过后,这8个专业最有前景,快看看有你的专业吗?
  18. 职业生涯步步高(转)
  19. vue为什么需要nodejs 的环境
  20. Redux和react-redux的区别是什么?

热门文章

  1. 2022-2028年中国纳滤膜产业发展态势及市场发展策略报告
  2. 2022-2028年中国水基胶行业市场深度评估及前瞻研究报告
  3. Go 学习笔记(59)— Go 第三方库之 etcd/clientv3 封装为方法使用(建立连接、设置key-value、获取key-value、获取带前缀的key-value)
  4. Python 典型错误及关键知识点
  5. 第五周周记(国庆第七天)
  6. 【UML建模】UML图详细总结
  7. 论文溯源树AMiner
  8. 联邦学习fate笔记小结
  9. Bi-LSTM-CRF for Sequence Labeling
  10. Atomic Layer Deposition原子层沉积技术