RadWindowManager to handle different sizes

6 posts, 0 answers
  1. Oscar
    Oscar avatar
    16 posts
    Member since:
    Sep 2013

    Posted 07 May 2014 Link to this post

    Good Afternoon

    I'm using a RadWindowManager to open several popup windows. For this, I use javascripts functions to open new URLs of the aspx pages. Following an example:

    function openRadWindowContact(contactid, action) {
                var rwManager = GetRadWindowManager();
                rwManager.SetWidth(200);
                rwManager.SetHeight(200);
                var oWnd = radopen("../ContactDetail.aspx?ContactID=" + contactid + "&Operation=" + action, "Contact Detail");
                oWnd.center();
            }

    Of course not all of the aspx files require the same width/height. The first time I open a popup it is presented with correct sizes, but the next popup is presented with the same Height and Width as the previous one.

    I use a custom javascript function to open each of the different popup windows I need, and I am trying to use .SetWidth & .SetHeight values to 200 (small square that would be resized according to the content of the page)....but it seems not to be working, actually the .SetWidth & .SetHeight properties are working only after a postback (I can tell this cause I'm using the property ShowContentDuringLoad="false" on RadWindowManager and it takes that small size while showing the loading gif).

    Is there a way to make RadWindowManager to handle correctly the sizes for each of the windows I'm opening?

    Thanks in advance for your help!
    Oscar


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

    Posted 08 May 2014 in reply to Oscar Link to this post

    Hi Oscar,

    Unfortunately I couldn't replicate the issue at my end. Please have a look into the sample code snippet which works fine at my end. Please provide your code if it doesn't help.

    ASPX:
    <telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" OnItemCreated="RadGrid1_ItemCreated" CellSpacing="-1" GridLines="Both">
        <MasterTableView DataKeyNames="OrderID" ClientDataKeyNames="OrderID">
            <Columns>
                <telerik:GridTemplateColumn>
                    <ItemTemplate>
                        <asp:HyperLink ID="Link1" runat="server" Text="Edit"></asp:HyperLink>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
    <telerik:RadWindowManager ID="RadWindowManager1" runat="server" EnableShadow="true">
    </telerik:RadWindowManager>

    C#:
    protected void RadGrid1_ItemCreated(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if (e.Item is GridDataItem)
        {
            HyperLink editLink = (HyperLink)e.Item.FindControl("Link1");
            editLink.Attributes["href"] = "javascript:void(0);";
            editLink.Attributes["onclick"] = String.Format("return ShowEditForm('{0}');", e.Item.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["OrderID"]);
        }
    }

    JavaScript:
    <script type="text/javascript">
        function ShowEditForm(id) {
            var grid = $find("<%= RadGrid1.ClientID %>");
            var windowManager = $find("<%=RadWindowManager1.ClientID %>");
            windowManager.SetWidth("200px");
            windowManager.SetHeight("200px");
            radopen("window.aspx?OrderID=" + id);
        }
    </script>

    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Oscar
    Oscar avatar
    16 posts
    Member since:
    Sep 2013

    Posted 08 May 2014 in reply to Shinu Link to this post

    Hi Shinu,

    First of all, thanks for your help. I saw in your example that you are having no issues. Sorry If I didn't give a good explanation to my personal issue, let me try again: In my case I'm opening more than 1 aspx file, and they have different contents, for example: one is a Detail Form for taking the info for a new Contact and the other is just a small window for Delete Confirmation.

    So, in my case the detail contact form is about 700px width, and the delete confirmation is only about 300px width. If I open first the Contact Detail form, on loading process the frame is presented with 200x200 size, when loading is complete it is resized to the 700px of width of the form (this behavior is correct). After that I close this window and click on a button that opens Delete Confirmation, but it is presented with the 700px width and the height from Contact Detail Form. Even when I am using .SetWidth and .SetHeight to RadWindowManager before openening each window, it seems that only works the first time after a postback.

    In the code you kindly posted, it seems that you are open over and over again the same aspx file, so there is no issues on the size because it is the same. Please if you could try opening two or more aspx files with different sizes and confirm if it is working ok and I'm doing something wrong.

    Hope this information could clarify my current scenario.

    Thanks again
  5. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 08 May 2014 in reply to Oscar Link to this post

    Hi Oscar,

    Please have a look into the sample code snippet to change the size of RadWindowManager.
    ASPX:
    <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
    </telerik:RadWindowManager>
    <telerik:RadButton ID="radbtnContactDetails" runat="server" Text="Contact Details"
        AutoPostBack="false" OnClientClicked="OpenContactDetails">
    </telerik:RadButton>
    <telerik:RadButton ID="radbtnDeleteConfirm" runat="server" Text="Delete Confirmation"
        AutoPostBack="false" OnClientClicked="OpenDeleteConfirmation">
    </telerik:RadButton>

    JavaScript:
    <script type="text/javascript">
         var width = 200;
         var height = 200;
        function OpenContactDetails(sender, args) {
                var oWindow = window.radopen('Default7.aspx', null);
                oWindow.setSize(width, height);  
                oWindow.center();
                width += 200;
                height += 200;
        }
        function OpenDeleteConfirmation(sender, rags) {
                var oWindow = window.radopen('Default11.aspx', null);
                oWindow.setSize(width, height);  
                oWindow.center();
                width -= 200;
                height -= 200;
        }
    </script>

    Hope this will helps you.
    Thanks,
    Shinu.
  6. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 09 May 2014 Link to this post

    Hello Oscar,

    Dimensions should be set to the individual RadWindow you want to resize, not to the manager. Here is an example:

    function openRadWindowContact(contactid, action) {
                 var rwManager = GetRadWindowManager();
                 var oWnd = rwManager.open("../ContactDetail.aspx?ContactID=" + contactid + "&Operation=" + action, "Contact Detail", width, height, top, left); //where widht, height, top and left are optional
             }

    This, and more options, are explained here: http://www.telerik.com/help/aspnet-ajax/window-programming-opening.html.

    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.

     
  7. Oscar
    Oscar avatar
    16 posts
    Member since:
    Sep 2013

    Posted 09 May 2014 in reply to Marin Bratanov Link to this post

    Hi Nishu and Marin Bratanov

    I really appreciate all your time and help. Due to simplicity and easy implementation I am following Bratanov's suggestion. Just checked and it is working flawless.

    Issue solved, thanks a lot!

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