Add button to titlebar

2 posts, 0 answers
  1. Savyo
    Savyo avatar
    75 posts
    Member since:
    Apr 2012

    Posted 22 Aug 2012 Link to this post

    Hi all,
         I want to add a button on the titlebar of the radwindow to close the radwindow. How do I add a button on the title-bar
    Savyo
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 22 Aug 2012 Link to this post

    Hi Savyo,

    Try the following code snippet to achieve your scenario.

    CSS:
    <style type="text/css">
      .customclosebutton
        {
           background: url(image.gif) !important;
        }
      .customclosebutton:hover
        {
           background: url(image.gif) 0 -26px !important;
        }
    </style>

    ASPX:
    <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
      <Windows>
        <telerik:RadWindow ID="RadWindow1" runat="server" OnClientShow="OnClientShow" VisibleOnPageLoad="true">
        </telerik:RadWindow>
      </Windows>
    </telerik:RadWindowManager>

    JS:
    <script type="text/javascript">
        function OnClientShow(radWindow) {
            var TitleBar = radWindow.GetTitlebar();
            var parent = TitleBar.parentNode;
            var oUL = parent.getElementsByTagName('UL')[0];
            if (!(oUL.firstChild.id == "customclosebuttonID")) {
                oUL.style.width = "192px";
                var oLI = document.createElement("LI");
                oLI.id = "customclosebuttonID"
                var A = document.createElement("A");
                oLI.appendChild(A);
                A.className = "customclosebutton";
                A.href = "javascript:void(0)";
                A.title = "Close";
                A.onmousedown = closewindow;
                oUL.insertBefore(oLI, oUL.firstChild);
                radWindow._updateTitleWidth();
            }
        }
        function closewindow(e) {
            var oManager = GetRadWindowManager();
            var oWnd = oManager.GetWindowByName("RadWindow1");
            oWnd.Close();
            return $telerik.cancelRawEvent(e);
        }
    </script>

    Hope this helps.

    Regards,
    Princy.
Back to Top