Skip Navigation LinksHome / Community & Support / Developer Productivity Tools Forums / ASP.NET MVC > General Discussions > telerik mvc window close button is hidden

Not answered telerik mvc window close button is hidden

Feed from this thread
  • Joanna avatar

    Posted on Feb 7, 2012 (permalink)

    i am using teterik mvc window to show a partial view. I can see the close button icon on my local machine. But after i deployed on the server close icon is not showing up. When i click on right corner of title bar of the window, i can see a highlighted area, if i click this the popup window is closed. Do i need to install telerik on my test server? Please help.

    Thank you!

    Reply

  • Dimo Dimo admin's avatar

    Posted on Feb 7, 2012 (permalink)

    Hello Joanna,

    The provided information suggests that the sprite image that contains all icons, cannot be loaded - do you have it on the server? Please check what is the request URL with some inspector / fiddler / etc., and what is the server response.

    Less likely, you might have a CSS issue that is triggered on the server only, due to IE switching to compatibility (or standards) mode. This can be easily checked.

    You don't have to install the Telerik MVC extensions on the web server, but you need to have the scripts in the /Script/ folder, the CSS files in the Content folder, and a valid reference to the Telerik.Web.Mvc dll. More details are available in the documentation.

    All the best,
    Dimo
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>

    Reply

  • Joanna avatar

    Posted on Feb 7, 2012 (permalink)

    Dimo, Thanks for your quick response. This is the first project i am working in telerik. Your documention and help is so good, that i love to use telerik more. Thanks for your support.

    I verified IE versions on local n server, both are IE8. I copied Content and Scripts folders from my local to server. I am using Webblue theme, i tried using other themes also, but issue is the same. So its not specific to sprite.png of webblue.
    I can see the title bar and it highlights the area where close icon shld be there and close function also works fine. i checked the png, i can see close icon in white color. May be i can changes the color of close icon, then it will be visible? OR i can add close button on window creation explicitly. Please suggest. Thanks alot!

    the code creating window is:

    var AccountSetupForm = (function () {
            return {
                init: function () {
                },
                displayPopUpWindow: function (processid) {

                    var postData = {
                        processid: processid                   
                    };

                    $.post("/ExpenseReport/Home/GetNewAccountViewHtml", postData, function (data) {
                        $.telerik.window.create({
                            title: "New Address",
                            html: unescape(data.viewHtml),
                            modal: true,
                            resizable: false,
                            visible: false,
                            width: 200,
                            height: 100,
                            onClose: function() {}

                        })
                .data('tWindow').center().open();
               
                    });
                }
            };

        })();

        $(document).ready(function () {
            AccountSetupForm.init();
        });
    --------------------------------------------------------------------------------------------------------------------------------------------------
    here is my layout file:

    <html>
    <head>
     <title>@ViewBag.Title</title>
     <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
     <link href="@Url.Content("~/Content/telerik.webblue.min.css")" rel="stylesheet" type="text/css" />
     <script src="~/Scripts/jquery-1.6.4.min.js" type="text/javascript"></script>       
     <script src="~/Scripts/2011.3.1115/telerik.common.min.js" type="text/javascript"></script>   
      <script src="~/Scripts/2011.3.1115/telerik.draganddrop.min.js" type="text/javascript"></script>   
     <script src="~/Scripts/2011.3.1115/telerik.window.min.js" type="text/javascript"></script>
       
    @(Html.Telerik().StyleSheetRegistrar().DefaultGroup(group => group.Add("telerik.common.min.css").Add("telerik.webblue.min.css").Combined(true).Compress(true))) 
    </head>
    <body>
    @(Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Add("telerik.common.js").Add("telerik.draganddrop.js").Add("telerik.window.min.js").Combined(true).Compress(true)))

     <div class="page">
      
      <section id="main">
       @RenderBody()
      </section>
      <footer>
      </footer>
     </div>
    @(Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Combined(true).Compress(true)))</body>
    </html>

    Reply

  • Dimo Dimo admin's avatar

    Posted on Feb 7, 2012 (permalink)

    Hi Joanna,

    Did you try the suggestion in my previous post:

    "Please check what is the request URL with some inspector / fiddler / etc., and what is the server response."

    (I mean the sprite.png request URL)

    In addition, I see some strange things in your code:

    - the webblue CSS file is registered twice - once manually and once from the StyleSheetRegistrar
    - jQuery and some other Telerik JS files are also registered twice - once manually and once from the ScriptRegistrar
    - both ScriptRegistrars are declared with @( ) code blocks. Only one registrar should have such a code block. All others should have @{ }


    Dimo
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>

    Reply

  • Joanna avatar

    Posted on Feb 7, 2012 (permalink)

    Dimo, thanks for your quick response.

    I checked the url using fiddler. i am getting 404 error for sprite.png.
    sprite.png is in the given folder.

    GET /ExpenseReport/Content/2011.3.1115/WebBlue/sprite.png is throwing http 404 error.
    Its able to load webblue.css from "Content/2011.3.1115", but not sprite.png. Any suggesitions? Thanks for your help!

    I cleaned up my layout file.
    -----------------------------------------------------------------------------------------------

    <!DOCTYPE html>
    <html>
    <head>
     <title>@ViewBag.Title</title>
     <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
     <script type="text/javascript" src="<%= Url.Javascript("jquery-1.2.6") %>"></script>

    <link href="@Url.Content("~/Content/ui.all.css")" rel="stylesheet" type="text/css" />
     
    @(Html.Telerik().StyleSheetRegistrar().DefaultGroup(group => group.DefaultPath("~/Content/2011.3.1115")
    .Add("telerik.common.css").Add("telerik.webblue.css").Combined(true).Compress(true))) 
    </head>
    <body>

    @(Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Add("telerik.common.js").Add("telerik.draganddrop.js").Add("telerik.window.js").Combined(true).Compress(true)))

     <div class="page">
      
      <section id="main">
       @RenderBody()
      </section>
      <footer>
      </footer>
     </div>
    </body>
    </html>

    Reply

  • Dimo Dimo admin's avatar

    Posted on Feb 8, 2012 (permalink)

    Hi Joanna,

    This is strange. The problem should be related to the web server, the image file name or its location. Please double-check. Try opening the image by entering its URL in the browser's address bar directly. Are you able to get the image by using any URL?

    Keep in mind that the sprite image is referenced in the CSS file with a relative URL. If the CSS file is located at URL "X / telerik.webblue.css", the sprite image must be located at "X / WebBlue / sprite.png".

    By the way, why are you using a DefaultPath() for the SttyleSheetRegistrar in this case? The path matches the location where the registrar would look anyway, if you are using version 2011.3 1115.

    Regards,
    Dimo
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>

    Reply

  • Joanna avatar

    Posted on Feb 9, 2012 (permalink)

    Dimo,

    I added Deafult path, just to make sure its pointing to the correct folder. I took it out then also same issue.

    I can see the sprite.png in my local. In my local machine, my application inside default web site, where as on test server its inside a website (not default). Thats may be causing the issue, but still i can see webblue.css only sprite png not found.

    I placed a"close' button inside my partial view and want to close the popup window using this. When i wrote window.close(), it pops up an alert and closes the parent window also.  Then i added OnClose event for the close button. I have the handler in the parent window as
     function OnClose() {
            var window = $('#Window').data('tWindow');
            window.close();

    but i get error saying "window" is undefined. Can you help how to close telerik popup window using button handler. I tried adding onClose of window within the window definition ,that also didn't work.

    Thanks for your help!.

    Reply

  • Dimo Dimo admin's avatar

    Posted on Feb 9, 2012 (permalink)

    Hi Joanna,

    I am afraid I am out of ideas. Please send a standalone runnable project, so that I can test it locally.

    Greetings,
    Dimo
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>

    Reply

Back to Top

Skip Navigation LinksHome / Community & Support / Developer Productivity Tools Forums / ASP.NET MVC > General Discussions > telerik mvc window close button is hidden