How to center a window on first open and maintain pinned position?

5 posts, 0 answers
  1. Zak
    Zak avatar
    15 posts
    Member since:
    Jan 2015

    Posted 22 Jan 2015 Link to this post

    Hi!

    I'm using this code to open a window:

    var ssButton = $("#server-settings-button")
        .bind("click", function () {
              ssWindow.data("kendoWindow").open().center();
        });

    Window is opened centered, but if I move it, pin it, close it and try to open it again it opens centered and doesn't maintain pinned position.

    How can  open it centered but still maintain pinned position?
  2. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 24 Jan 2015 Link to this post

    Hello Zak,

    I am not sure I understand you correctly. If you want the Window widget to be centered only when it is opened for the first time, then use the center() method only once after initialization (without opening the Window), and then use only open() in the button click handler.

    There is no requirement to use center() and open() at the same time.

    Regards,
    Dimo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Zak
    Zak avatar
    15 posts
    Member since:
    Jan 2015

    Posted 26 Jan 2015 in reply to Dimo Link to this post

    Hi Dimo,
    Yes, you understood me correctly.

    Here Is my code which I use at the moment, it works without centering the window:

                    var ssWindow = $("#server-settings-window");

                    var ssButton = $("#server-settings-button")
                            .bind("click", function () {
                                ssWindow.data("kendoWindow").open();
                            });

                    if (!ssWindow.data("kendoWindow")) {
                        ssWindow.kendoWindow({
                            visible: false,
                            width: kendoWindowWidth + "px",
                            position: { top: topOffset, left: (globalWidth - kendoWindowWidth) / 2 },
                            title: "Server",
                            actions: [
                                "Pin",
                                "Minimize",
                                "Maximize",
                                "Close"
                            ]
                        });
                    }

    I'm trying to center the window before initialisation, but it doesn't work.
    I tried this: 

    var ssWindow = $("#server-settings-window");
    ssWindow.center(); // this doesn't work

    And this:

    var ssWindow = $("#server-settings-window");
    ssWindow.kendoWindow.center(); // this doesn't work either

    How can I do it?

    Thanks









  5. Zak
    Zak avatar
    15 posts
    Member since:
    Jan 2015

    Posted 26 Jan 2015 in reply to Zak Link to this post

    Sorry, I meant to say after initialisation but before opening.
  6. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 27 Jan 2015 Link to this post

    Hello Zak,

    ssWindow.center(); // this doesn't work ... because the center() method is executed over a jQuery DOM element, instead of a Window instance.

    ssWindow.kendoWindow.center(); // this doesn't work either ... for two reasons: first, this statement will generate a Javascript error due to missing brackets; second, if you add the missing brackets for kendoWindow(), you will end up with the case above, because Kendo UI widget initializer methods return jQuery DOM elements, not widget instances.

    Please refer to the documentation below, which deals with getting widget references and executing methods, and let me know if there is anything unclear, so that we can improve it if needed.

    http://docs.telerik.com/kendo-ui/basics/events-and-methods#obtain-a-reference-to-a-kendo-ui-widget-instance-using-jquery

    http://docs.telerik.com/kendo-ui/api/javascript/ui/window#methods-center

    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top
Kendo UI is VS 2017 Ready