Expand Arrow now working when children dynamically loaded

6 posts, 0 answers
  1. Nigel
    Nigel avatar
    6 posts
    Member since:
    Oct 2012

    Posted 27 Jul Link to this post

    We have large trees that contains multiple levels like:

    Root

      Item 1

        Item1-A

        Item1-B

      Item 2

        Item2-A

        Item2-B

    The children are loaded dynamically using the onselect event for the item, so using the above example, Item1-A has children, but they have not yet been loaded when the tree is created. Item1-A will display with the expand arrow.

    Clicking on the Item1-A (text in the tree), expands to show the children, however when clicking on the expand arrow next to Item1-A, the expand arrow disappears, the Item1-A text is selected, but the onselect event is not fired so the children are not displayed.

    We don't want to load the next level children (which does resolve the problem) due to performance requirements.

    Is there any way we can either

    a) Disable the expand arrow action (i.e. we are happy if the user consistently just clicks on the item text and the expand arrow is for display only)

    or

    b) Fire a select event when clicking on the expand arrow so that it performs the same action as clicking on the text in the tree.

    Thanks.

  2. Ivan Danchev
    Admin
    Ivan Danchev avatar
    837 posts

    Posted 29 Jul Link to this post

    Hello Nigel,

    You can handle the TreeView's Expand event, in its handler check the level of the node that is about to be expanded and if it it higher than level 1 (0 is the root level, 1 is "Item 1"'s level, etc.) prevent the event:
    function onExpand(e) {
        if ($(e.node).parentsUntil(".k-treeview", ".k-item").length > 1) {
            e.preventDefault();
        }
    }


    Regards,
    Ivan Danchev
    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Nigel
    Nigel avatar
    6 posts
    Member since:
    Oct 2012

    Posted 31 Jul in reply to Ivan Danchev Link to this post

    Hi,

    The e.preventDefault() function seems to disable both the expand action on the arrow and the expand action when selecting on the node text itself.

    The expand action on the node text is working as required and we need to keep this working. Ideally we want the expand arrow to work the same way as the node text when using the onselect event, but being able to disable just the expand arrow action would be OK as well.

    Would it be possible to extend your answer to only select the expand arrow in the onExpand event and disable just the arrow and not the node text? ... or is there some other approach we can take?

    Thanks,

    Nigel

     

  5. Ivan Danchev
    Admin
    Ivan Danchev avatar
    837 posts

    Posted 02 Aug Link to this post

    Hello Nigel,

    The following could be a workaround that would allow the node expansion on click of its text but prevent the expansion on the expand arrow click:
    $(document).ready(function() {
        var arrowClicked = false;
        $("#treeview").delegate( ".k-icon", "click", function() {
            arrowClicked = true;
        });
    });
     
    function onExpand(e) {
        if (arrowClicked) {
            if ($(e.node).parentsUntil(".k-treeview", ".k-item").length > 0) {
                arrowClicked = false;
                e.preventDefault();
            }
        }
    }


    Regards,
    Ivan Danchev
    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Nigel
    Nigel avatar
    6 posts
    Member since:
    Oct 2012

    Posted 02 Aug Link to this post

    Excellent. Thank you - that is working for us.

     

    Nigel.

  7. Ivan Danchev
    Admin
    Ivan Danchev avatar
    837 posts

    Posted 04 Aug Link to this post

    Hello Nigel,

    We are glad we were able to assist you.

    Regards,
    Ivan Danchev
    Telerik by Progress
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET MVC is VS 2017 Ready