zoukankan      html  css  js  c++  java
  • AjaxControlToolkit HoverMenuExtender 控件演示

    AjaxControlToolkit有一个HoverMenuExtender控件用于当鼠标滑过一个Web控件时,弹出一个列表,首先观看效果:

    这是AjaxControlToolkit控件,当然是在Ajax下应用。在aspx页面中应该要写上:

    ScriptManager
     <asp:ScriptManager ID="ScriptManager1" runat="server">
        
    </asp:ScriptManager>


    不然在页面run时,会出现如下Error: 

    Server Error in '/InsusTutorials' Application.

    The control with ID 'UpdatePanel1' requires a ScriptManager on the page. The ScriptManager must appear before any controls that need it.

    Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

    Exception Details: System.InvalidOperationException: The control with ID 'UpdatePanel1' requires a ScriptManager on the page. The ScriptManager must appear before any controls that need it.

    Source Error:

    An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.

    Stack Trace:

    [InvalidOperationException: The control with ID 'UpdatePanel1' requires a ScriptManager on the page. The ScriptManager must appear before any controls that need it.]
                System.Web.UI.UpdatePanel.get_ScriptManager() +205
                System.Web.UI.UpdatePanel.RegisterPanel() +89
                System.Web.UI.UpdatePanel.OnInit(EventArgs e) +20
                System.Web.UI.Control.InitRecursive(Control namingContainer) +391
                System.Web.UI.Control.InitRecursive(Control namingContainer) +188
                System.Web.UI.Control.InitRecursive(Control namingContainer) +188
                System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +1579
                


    Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.431

     接下来,我们在网页上,放置一个web控件,下示例是使用fieldset,它是一个Html标题,把它转为一个Web控件,所以加上run="server"属性。

    fieldset
     <fieldset id="fieldsetl" runat="server" style="margin: 10px; padding: 3px;  13.2%;"
                    align
    ="absmiddle" onmouseover="this.style.backgroundColor='#99ccff'" onmouseout="this.style.backgroundColor='' ">
                    HoverMenuExtender
                
    </fieldset>

    如果你为HoverMenuExtender指定一个Html 标签的时,它会Error:

     

    Server Error in '/InsusTutorials' Application.

    The TargetControlID of 'HoverMenuExtender1' is not valid. A control with ID 'fieldsetl' could not be found.

    Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

    Exception Details: System.InvalidOperationException: The TargetControlID of 'HoverMenuExtender1' is not valid. A control with ID 'fieldsetl' could not be found.

    接下来,把HoverMenuExtender控件拉至网页内,两个属性一个要写TargetControlID和PopupControlID,前者是激活菜单的控件ID,此例的TargetControlID是fieldsetl,而后者是Popup菜单控件ID, 此例指向Panel1

    HoverMenuExtender
     <ajaxToolkit:HoverMenuExtender ID="HoverMenuExtender1" runat="server" TargetControlID="fieldsetl"
                    PopupControlID
    ="Panel1" PopupPosition="Right" OffsetX="5" OffsetY="3" />

     最后,是写Popup菜单Panel控件,从工具栏拉至网页。

    Panel1
    <asp:Panel ID="Panel1" runat="server" CssClass="HoverMenuStyle">
                    Hello Insus.NET!
                    
    <br />
                    This is AjaxControlToolkit HoverMenuExtender control demo.
                
    </asp:Panel>

     不要忘记了,还要为这个Panel写上样式:

    HoverMenuStyle
    .HoverMenuStyle
            
    {
                background
    : #fff6bf;           
                text-align
    : left;
                padding
    : 5px;
                border
    : 1px solid #ffd324;
                display
    : none;
                z-index
    : 1;
            
    }

     应该不难喔。

  • 相关阅读:
    第七章补充 -- 关于文件目录的交互 OS
    第七章 -- 关于文件
    Python 函数声明和调用
    第三章 -- Python的基本数据类型
    关于tomcat控制台乱码
    UTF8MB4 是支持 表情符号的
    ngnix启动不了 解决办法
    关于jmeter 加载jar文件的疑问
    jmeter 使用 随机数据+md5加密注意事项
    jmeter 分布式注意事项
  • 原文地址:https://www.cnblogs.com/insus/p/2112934.html
Copyright © 2011-2022 走看看