Is it possible to change splitter orientation?

6 posts, 0 answers
  1. Raido Valgeväli
    Raido Valgeväli avatar
    26 posts
    Member since:
    May 2008

    Posted 07 Jun 2013 Link to this post

    I've prepared a little demo here:
    http://70.43.83.4/test/split.html

    On clicking the "turn" button it almost does what is needed but not quite..
    Is there something I do wrong or is it a bug or not implemented?
    (I call the "size" after change because by documentation it redraws the splitter)

    Thanks.
     Raido
  2. Dimo
    Admin
    Dimo avatar
    8330 posts

    Posted 10 Jun 2013 Link to this post

    Hello Raido,

    The Splitter's orientation can be changed on the fly like this:

    var splitter = $("#splitter").data("kendoSplitter");
     
    // set the desired new orientation value:
    splitter.orientation = splitter.options.orientation = (splitter.orientation == "vertical" ? "horizontal" : "vertical");
     
    splitter.element
        .children(".k-splitbar").remove()
        .end()
        .children(".k-pane").css({width: "", height: "", top: "", left: ""});
     
    splitter.trigger("resize");


    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. Raido Valgeväli
    Raido Valgeväli avatar
    26 posts
    Member since:
    May 2008

    Posted 11 Jun 2013 Link to this post

    Hi, Dino

    I understand this is a non-standard case and therefore really appreciate that you found the information for me. Still it ALLMOST works, having issue of second pane being non-resizeable when the orientation turns.
    Please see the sample here (press the Turn button):
    http://70.43.83.4/test/kendo.htm

    Additionally if you move the separator between left and right before hitting Turn, the second pane gets 0 size and hiding below bottom window edge.

    Anyways, thank you very much for the information! 

     Raido
  5. Dimo
    Admin
    Dimo avatar
    8330 posts

    Posted 12 Jun 2013 Link to this post

    Hi Raido,

    Yes, indeed, splitbars don't work as expected. However, please note that the discussed scenario is not officially supported and is practically a hack. I did not mention this in my previous reply, as it seemed that there were no side effects.

    In order to achieve proper behavior, I suggest you to do the following:

    + remove all splitbars
    + remove all Splitter-specific classes and CSS styles from the panes (.k-pane, width, height, top, left)
    + destroy the Splitter object

    $("#horisontal").data("kendoSplitter").destroy();


    + initialize a new Splitter instance with the desired settings

    Regards,
    Dimo
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Thomas
    Thomas avatar
    12 posts
    Member since:
    Jul 2013

    Posted 10 Dec 2015 in reply to Dimo Link to this post

    Hello,

    Two years have passed since your reply.

    Isn't there a new, more appropriate way of changing the orientation? 

    Thank you in advance.

  7. Dimo
    Admin
    Dimo avatar
    8330 posts

    Posted 10 Dec 2015 Link to this post

    Hello Thomas,

    The demand for the discussed feature has not been high enough for us to implement built-in orientation change. Please use the approach described above.

    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