RadWindow Not Modal In IE (the best browser of all time)

10 posts, 1 answers
  1. Michael
    Michael avatar
    2 posts
    Member since:
    Apr 2011

    Posted 27 Apr 2011 Link to this post

    Hey All,

    We have a few select pages where the modality of all the RadWindows is not...well modal.  This occurs in Internet Explorer (IE6, IE7, IE8) only.  Firefox, Safari, and Chrome all display the RadWindows as expected (see attached).

    We have tried 
    1. Reordering the windows within the RadWindowManager
    2. Removing all but one entry in <RadWindowManager><Windows>...
    3. Using radopen() vs .set_navigateUrl() with a show()
    4. Setting the modality on the client-side with .set_modal(true);
    5. Setting the modality in the markup (Modal="True") on the RadWindowManager and the RadWindow themselves
    6. Setting the modal in the codebehind 
    7. Asking IE nicely

    .aspx
    <telerik:RadWindowManager runat="server" ID="rwmManager" VisibleStatusbar="False"
            OnClientClose="OnClientClose" OnClientShow="OnClientShow" EnableShadow="True"
            ShowContentDuringLoad="false" Skin="Office2007" Modal="True" Behaviors="Move"
            KeepInScreenBounds="True" ReloadOnShow="True">
            <Windows>
                <telerik:RadWindow runat="server" ID="rwLetter" Width="500" Height="300">
                </telerik:RadWindow>
                <telerik:RadWindow runat="server" ID="rwLookup" Width="1010" Height="600">
                </telerik:RadWindow>
                <telerik:RadWindow runat="server" ID="rwViewDocuments" Width="900" Height="400">
                </telerik:RadWindow>
                <telerik:RadWindow runat="server" ID="rvViewDuplicates" Width="700" Height="400">
                </telerik:RadWindow>
                <telerik:RadWindow runat="server" ID="rwGridEntry" Title="Add/Modifiy Detail Line"
                    VisibleStatusbar="true" Width="1000" Height="650" ShowContentDuringLoad="false">
                    <ContentTemplate>
                        <afs:Toolbar runat="server" ID="GridToolbar" />
                        <div id="destination" />
                    </ContentTemplate>
                </telerik:RadWindow>
            </Windows>
        </telerik:RadWindowManager>
    #destination has content that is filled in after render using jQuery.  I've remove this event with same effect thinking jQuery was the culprit. 

    Any help is greatly appreciated.

    Cheers,
    Mike
  2. Svetlina Anati
    Admin
    Svetlina Anati avatar
    2795 posts

    Posted 29 Apr 2011 Link to this post

    Hello Michael,

     Thank you for the provided demo code, I was able to reproduce the problem.


    The problem seems to be in the RadWindow with ContentTemplate - in this case, we have moving content in the DOM and for some reason the modal overlay is added to the invisible element of the radWindow.

    The easiest workaround I can provide for the time being is to set runat="server" attribute for the DIV as follows:

    <telerik:RadWindowManager runat="server" ID="rwmManager" VisibleStatusbar="False"
          EnableShadow="True" ShowContentDuringLoad="false" Skin="Office2007" Modal="True"
          Behaviors="Move" KeepInScreenBounds="True" ReloadOnShow="True" VisibleOnPageLoad="true">
          <Windows>
              <telerik:RadWindow runat="server" ID="rwLetter" Width="500" Height="300">
              </telerik:RadWindow>
              <telerik:RadWindow runat="server" ID="rwLookup" Width="1010" Height="600">
              </telerik:RadWindow>
              <telerik:RadWindow runat="server" ID="rwViewDocuments" Width="900" Height="400">
              </telerik:RadWindow>
              <telerik:RadWindow runat="server" ID="rvViewDuplicates" Width="700" Height="400">
              </telerik:RadWindow>
              <telerik:RadWindow runat="server" ID="rwGridEntry" Title="Add/Modifiy Detail Line"
                  VisibleStatusbar="true" Width="1000" Height="650" ShowContentDuringLoad="false">
                  <ContentTemplate>
                      <div id="destination" runat="server" />
                  </ContentTemplate>
              </telerik:RadWindow>
          </Windows>
      </telerik:RadWindowManager>

    I understand that this is not a real solution and we will fix the problem or at least provide more information on the matter next week.

    I updated your account with some telerik points for your kind cooperation.

    Thank you once again for your report, I will follow you up here once I have some additional useful information about the problem.

    Kind regards,
    Svetlina
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

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

    Posted 29 Apr 2011 Link to this post

    Hello Michael,

     I just notice that your DIV element has a self closing tag and this is the reason for the problem. This does not work under IE and hence the problem with the modal overlay parent occurs - more information about this is available below:

    http://www.google.bg/#hl=bg&safe=strict&biw=1659&bih=951&rlz=1W1ADFA_en&q=div+self+closing+ie&aq=f&aqi=&aql=&oq=&fp=e439a2c802a5a497

    This being said, please modify your content in order to be valid as shown below and this will fix the problem:

    <telerik:RadWindowManager runat="server" ID="rwmManager" VisibleStatusbar="False"
          EnableShadow="True" ShowContentDuringLoad="false" Skin="Office2007" Modal="True"
          Behaviors="Move" KeepInScreenBounds="True" ReloadOnShow="True" VisibleOnPageLoad="true"
          <Windows
              <telerik:RadWindow runat="server" ID="rwLetter" Width="500" Height="300"
              </telerik:RadWindow
              <telerik:RadWindow runat="server" ID="rwLookup" Width="1010" Height="600"
              </telerik:RadWindow
              <telerik:RadWindow runat="server" ID="rwViewDocuments" Width="900" Height="400"
              </telerik:RadWindow
              <telerik:RadWindow runat="server" ID="rvViewDuplicates" Width="700" Height="400"
              </telerik:RadWindow
              <telerik:RadWindow runat="server" ID="rwGridEntry" Title="Add/Modifiy Detail Line"
                  VisibleStatusbar="true" Width="1000" Height="650" ShowContentDuringLoad="false"
                  <ContentTemplate
                      <div id="destination">< /div> 
                  </ContentTemplate
              </telerik:RadWindow
          </Windows
      </telerik:RadWindowManager>
    Greetings,
    Svetlina
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  5. Michael
    Michael avatar
    2 posts
    Member since:
    Apr 2011

    Posted 02 May 2011 Link to this post

    Thanks for the reply Svetlina.  Your second suggestion (property closing the </div>) worked perfectly and really does explain why more compliant browsers were ok but not IE.

    We've fixed this on the pages effected and will make it a policy amongst our developres to stick to opening and closing the markup especially on non-server side controls.

    Again, I really appreciate the help.

    Cheers,
    Mike
  6. Roger
    Roger avatar
    3 posts
    Member since:
    Sep 2011

    Posted 21 Sep 2011 Link to this post

    Hello,

    I have tried this fix in IE with no success. Everything works well in firefox and chrome. Here is my code:

    ... In my RadWindow's Cotent Template
    <

     

    div id="destination" runat="server">

     

     

        <Telerik:RadTabStrip ID="RadTabStrip" runat="server" MultiPageID="RadMultiPage" CausesValidation="false">

     

     

            <Tabs>

     

     

                <Telerik:RadTab runat="server" PageViewID="pv1" TabIndex="0" Text="xxx"></Telerik:RadTab>

     

     

            </Tabs>

     

        </

     

    Telerik:RadTabStrip>

     

        <

     

    div class="Tab_Content">

     

     

             <Telerik:RadMultiPage ID="RadMultiPage" runat="server" ScrollBars="Auto" SelectedIndex="0">

     

     

                 <Telerik:RadPageView ID="pv1" runat="server" TabIndex="0">

     

     

                    <My:Control ID="xxx" runat="server" />

     

     

                </Telerik:RadPageView>

     

             </Telerik:RadMultiPage>

     

         </

     

    div>

     

     

    </div>
    ...
    I have also tried with this: <div id="destination" runat="server"> kalsjfd </div> and absolutely nothing in the content template.
    All I see is a page filled by opacity(grayed out), and a textbox like object in the middle of the page.

    Another issue on tab strip. Again, it works well in firefox and chrome, but no I.E. It shows tabs as hyperlinks assigned vertically.
    I hope I have provided enough information.

    Cheers,

    Roger

     

  7. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3599 posts

    Posted 22 Sep 2011 Link to this post

    Hi Roger,

    Your code seems fine to me, or at least the part we have. Please make sure that the user control is also valid HTML and does not throw JavaScript errors, as it is a part of the page where the RadWIndow is defined, and either of these occurring will result in some unexpected behavior.


    Kind regards,
    Marin
    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
  8. Brad
    Brad avatar
    6 posts
    Member since:
    Mar 2014

    Posted 14 May 2014 Link to this post

    I have an issue similar.  The windows open in modal in development, but after I deploy to the server, the windows no longer open in modal.  Also, the autosize does not work once deployed.

    ​<telerik:RadWindowManager ID="RadWindowManager1" runat="server" Modal="True">
    <Windows>
    <telerik:RadWindow ID="RadWindow3" runat="server"
    Animation="Slide" Modal="true" Overlay="true"
    VisibleStatusbar="False" NavigateUrl="PP.aspx"
    OpenerElementID="<%# ImageButtonPaymentPlan.ClientID %>"
    Style="display: none;" Title="Payment Plan" Width="1000" Height="660" Behavior="Close, Move, Reload"
    Behaviors="Close, Move, Reload" AutoSize="true">
    </telerik:RadWindow>

    <telerik:RadWindow ID="RadWindow1" runat="server"
    Animation="Slide" Modal="true" Overlay="true"
    VisibleStatusbar="False" NavigateUrl="JPH.aspx"
    OpenerElementID="<%# ImageButtonJPH.ClientID %>"
    Style="display: none;" Title="Hearing" Width="1000" Height="650" Behavior="Close, Move, Reload"
    Behaviors="Close, Move, Reload" AutoSize="true">
    </telerik:RadWindow>

    <telerik:RadWindow ID="RadWindow2" runat="server"
    Animation="Slide" Modal="true" Overlay="true"
    VisibleStatusbar="False" NavigateUrl="VRB.aspx"
    OpenerElementID="<%# ImageButtonVRB.ClientID %>"
    Style="display: none;" Title="Registration Block" Width="1000" Height="650" Behavior="Close, Move, Reload"
    Behaviors="Close, Move, Reload" AutoSize="true">
    </telerik:RadWindow>
    </Windows>
    </telerik:RadWindowManager>
  9. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3599 posts

    Posted 15 May 2014 Link to this post

    Hello Brad,

    The only reasons for such behavior I can think of are:

    If neither is the case, I would advise opening a support ticket where you can send us an URL (and, if needed, login credentials), so we can examine the page in question. It would help if you also explain how exactly you open these RadWindows.


    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.

     
  10. Brad
    Brad avatar
    6 posts
    Member since:
    Mar 2014

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

    My name is Olen, Brad is my boss who paid for the software.  But I'll answer to Brad here...

    It's not that I have more than one radwindowmanager.  I did, but I removed them prior to my previous post.  What strikes me as odd is that this works great in development.  Also, it's not a browser problem.  I checked both links you provided.  I also opened the internal app in chrome and witnessed the same behavior.  I will not be able to let you login to the app, it's internal.  But I can do a goto meeting so that you can see the issue.

    Thanks.
  11. Brad
    Brad avatar
    6 posts
    Member since:
    Mar 2014

    Posted 16 May 2014 in reply to Brad Link to this post

    Fixed it!  There was two lines of code missing from the Web.Config.  In addition to that, I had another method to open pages that was being called on the click event.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017