Strange behaviour when passing a content url as a parameter

7 posts, 0 answers
  1. David
    David avatar
    45 posts
    Member since:
    Feb 2012

    Posted 08 Feb 2012 Link to this post

    Hi,

    The following piece of code has some strange behaviour:
    $('.fx-modal-ajax').livequery(function() {
            $(this)
                .removeClass('fx-modal-ajax')
                .click(function(e) {
                    e.preventDefault();
                    var modalTitle = $(this).attr('data-modal-title');
                    var modalUrl = $(this).attr('data-modal-url');
                    var modalWidth = $(this).attr('data-modal-width');
                    $('<div></div>')
                        .kendoWindow({
                            width: modalWidth,
                            title: modalTitle,
                            content: modalUrl,
                            modal: true
                             
                        })
                        .data("kendoWindow")
                            .center()
                            .open();         
                });   
        });
     As you can see, we get the initialisation values from the dom object that is initialised as follows:

    <a class="fx-modal-ajax"
      data-modal-width="750px"
      data-modal-url="'index.php?_c=productaccountrefill&_a=ajaxquickrefill"
      data-modal-title="Add credit to your account"
      href="#">Add credit</a>

    This works fine, but for some reason, the height of the opened windows is always 100% of the viewport, even though the loaded content is much less in height.

    When in stead of getting the url from the link data-attribute, I pass the link directly in the javascript code, we have no problem whatsoever, and the windows resizes to the actual height of the loaded content.

    Any idea?
  2. David
    David avatar
    45 posts
    Member since:
    Feb 2012

    Posted 08 Feb 2012 Link to this post

    to be complete - in Safari it loads to 100% height of the viewport; in Firefox it seems to be loading at a fixed (default?) height...
  3. Kendo UI is VS 2017 Ready
  4. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 13 Feb 2012 Link to this post

    Hello David,

    Kendo Window intentionally doesn't have height set by default. This is done to make the Window auto resizable - to resize itself when content is added to it. The strange behavior you're experiencing is due to the different behavior of iframes in the different browsers. Unfortunately this can't be fixed automagically - you will need to set height of your iframe (or the Window) in order to work around it.

    Regards,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  5. David
    David avatar
    45 posts
    Member since:
    Feb 2012

    Posted 13 Feb 2012 Link to this post

    Kamen,

    Forgt about the browsers - that I can understand.
    What I don't understand is that when passing in the content parameter as a string, it works great, but when using a parameter it doen't.  That doesn't make sense to me.
  6. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 13 Feb 2012 Link to this post

    Hello David,

    I don't see any difference in the way the Window initializes, whether from data attribute or from a string. My best guess is that it depends on the speed the iframe content loads. Check the jsFiddle here:


    Kind regards,
    Kamen Bundev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  7. David
    David avatar
    45 posts
    Member since:
    Feb 2012

    Posted 14 Feb 2012 Link to this post

    Hello Kamen,

    Thanks for posting the jsFiddle.
    Yes, I don't see anything different there, but you're loading a page which has more than 100% height of my viewport, so it's normal that in your case it should load fine.

    I'll set up another test for you as soon as I have a few minutes...
  8. Tyrone
    Tyrone avatar
    13 posts
    Member since:
    Feb 2014

    Posted 05 Aug 2014 in reply to Kamen Bundev Link to this post

    This solution is awesome... I looked everywhere for it... thanks for the great post and the JSFiddle post
Back to Top
Kendo UI is VS 2017 Ready