rad window as modal pop-up

9 posts, 0 answers
  1. Narsing
    Narsing avatar
    4 posts
    Member since:
    Dec 2008

    Posted 30 Dec 2011 Link to this post

    1) Do you have an example to display image in a rad window as modal pop-up
    2) Display rad window on a image client side click event.

    Thanks.
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 30 Dec 2011 Link to this post

    Hello,

    Try the following.
    ASPX:
    <asp:Button ID="Button1" runat="server" Text="Click" OnClientClick="openwin();return false" />
    <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
       <Windows>
         <telerik:RadWindow ID="RadWindow1" runat="server"  Modal="true">
            <ContentTemplate>
               <iframe id="iframe1" runat="server" width="600px" height="600px" src="../Images/Image1.jpg">
                </iframe>
             </ContentTemplate>
         </telerik:RadWindow>
      </Windows>
    </telerik:RadWindowManager>

    JS:
    <script type="text/javascript">
     function openwin()
      {
        window.radopen(null, "RadWindow1");
      }
    </script>

    -Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 03 Jan 2012 Link to this post

    Hi Narsing,

    You could additionally simplify Shinu's code by removing the IFRAME placed in the ContentTemplate and put there a simple asp:Image or an img tag. Also, you do not need to return false in the onclick handler since you will be using  an img which is not a postback element in difference with the button Shinu has used.

    In order to get a better understanding on how to use RadWindow, please examine our online demos below:

    http://demos.telerik.com/aspnet-ajax/window/examples/overview/defaultcs.aspx

    Greetings,
    Svetlina Anati
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
  5. Balakrishna Reddy
    Balakrishna Reddy avatar
    37 posts
    Member since:
    Oct 2012

    Posted 28 Feb 2013 Link to this post

    Hi,
    i am new this,i want to display a popup window when ever i change the selectedIndex of a DropdownList.
    Please Help................
  6. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3596 posts

    Posted 28 Feb 2013 Link to this post

    Hi,

    I am not sure which dropdown list you need. If this is a standard select element you can use its onchange event. If you are using a RadComboBox you can use its OnClientSelectedIndexChanged event. Then open the RadWindow in any one of the manners shown in this help article: http://www.telerik.com/help/aspnet-ajax/window-programming-opening.html. If you want to do this from the server take a look at this sticky thread.


    All the best,
    Marin Bratanov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  7. Balakrishna Reddy
    Balakrishna Reddy avatar
    37 posts
    Member since:
    Oct 2012

    Posted 01 Mar 2013 Link to this post

    hi,
       The following is my code for displaying PopUp in my Page.
    Here when i am clicking on the Button it is not displaying PopUp...
    So Please help me...
     
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
         
          <asp:Button ID="Button1" runat="server" Text="Click here to show the modal" />
                <cc1:ModalPopupExtender ID="ModalPopupExtender1" BackgroundCssClass="ModalPopupBG"
                      runat="server" CancelControlID="btnCancel" OkControlID="btnOkay" TargetControlID="Button1"
                      PopupControlID="Panel1" Drag="true" PopupDragHandleControlID="PopupHeader">
                </cc1:ModalPopupExtender>
     
                <div id="Panel1" style="display: none;" class="popupConfirmation">
                      <div class="popup_Container">
                            <div class="popup_Titlebar" id="PopupHeader">
                                  <div class="TitlebarLeft">Popup Header</div>
                                  <div class="TitlebarRight"></div>
                            </div>
                            <div class="popup_Body">
                                  <p>
                                        This is a simple modal dialog
                                  </p>
                            </div>
                            <div class="popup_Buttons">
                                  <input id="btnOkay" value="Done" type="button" />
                                  <input id="btnCancel" value="Cancel" type="button" />
                            </div>
                      </div>
                </div>
     
    </asp:Content>
  8. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 03 Mar 2013 Link to this post

    Hello Balakrishna Reddy,

    I tried the mark up you provided but I was not able to replicate the issue. For me, everything is working fine with the same code provided that I made some modifications in the CSS classes since you have not given your CSS. Please have a look at the following code.

    ASPX:
    <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
        <div>
            <asp:Button ID="Button1" runat="server" Text="Click here to show the modal" />
            <cc1:ModalPopupExtender ID="ModalPopupExtender1" BackgroundCssClass="BackGround"
                runat="server" CancelControlID="btnCancel" OkControlID="btnOkay" TargetControlID="Button1"
                PopupControlID="Panel1" Drag="true" PopupDragHandleControlID="PopupHeader">
            </cc1:ModalPopupExtender>
            <div id="Panel1" style="display: none;" class="popupConfirmation">
                <div>
                    <div id="PopupHeader">
                        <div>
                            Popup Header</div>
                    </div>
                    <div>
                        <p>
                            This is a simple modal dialog
                        </p>
                    </div>
                    <div>
                        <input id="btnOkay" value="Done" type="button" />
                        <input id="btnCancel" value="Cancel" type="button" />
                    </div>
                </div>
            </div>
        </div>
    </asp:Content>

    CSS:
    <style type="text/css">
        .BackGround
        {
            background-color: Gray;
            filter: alpha(opacity=70);
            opacity: 0.7;
            z-index: 100 !important;
        }
        .popupConfirmation
        {
            padding-left: 20px;
            background-color: #7DE6F8;
            border: 1px solid red;
            width: 400px;
            height: 300px;
        }
    </style>

    Thanks,
    Princy.
  9. Asutosh
    Asutosh avatar
    130 posts
    Member since:
    Sep 2013

    Posted 05 Jun 2014 in reply to Marin Bratanov Link to this post

    hi i am using following code
    when i use it in simple aspx page it work properly but when i apply it in page which contain Master Page then it not working.
    can you tell me how to solve it

    <asp:Button ID="Button1" runat="server" Text="Click" OnClientClick="openwin();return false" />
        <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
            <Windows>
                <telerik:RadWindow ID="RadWindow1" runat="server" Modal="true">
                    <ContentTemplate>
                       <asp:Label runat="server" Text="open"></asp:Label>
                    </ContentTemplate>
                </telerik:RadWindow>
            </Windows>
        </telerik:RadWindowManager>
        <script type="text/javascript">
            function openwin() {
              
                window.radopen(null, "RadWindow1");
            }
    </script>






  10. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3596 posts

    Posted 05 Jun 2014 Link to this post

    Hello Asutosh,

    Most likely, you have several RadWindowManagers on the page, so radopen() is not tied to the one you need. This scenario and how to overcome it is explained here: http://www.telerik.com/help/aspnet-ajax/window-troubleshooting-wrong-window-opened.html.

    I also advise that you use RadWindows with their ContentTemplate outside of the Windows collection of a RadWindowManager, so you can use the $find().show() approach to open them.

    Regards,

    Marin Bratanov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017