Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Custom buttons on Kendo tree view Angularjs

I'm trying to add multiple buttons inside Kendo treeview node. I have used template to add multiple buttons but failed to achieve their features as the whole node is working a link. Please find below the HTML and JS

HTML

<div kendo-tree-view="tree" k-data-source="treeData" class="hasMenu" k-on-change="selectedItem = dataItem">
    <span k-template>
        {{dataItem.text}} 
        <i class="fa fa-plus" aria-hidden="true"></i>
        <i class="fa fa-trash" aria-hidden="true"></i>
    </span>
</div>

JS

$scope.treeData = new kendo.data.HierarchicalDataSource(
        {
            data: [
             {
                 text: "My Product",
                 items: [
                     {
                         text: "Building Materials",
                         items: [
                             { text: "Lumber & Composites" },
                             { text: "Molding" },
                             { text: "Drywall" },
                             { text: "Doors" }
                         ]
                     },
                     { text: "Decor" },
                     { text: "Chemicals" },
                     { text: "Hardware" },
                     { text: "Lighting & Fixtures" },
                     { text: "Paint" },
                     { text: "Storage & Organization" },
                     { text: "Window Coverings" },
                 ]
             },
             {
                 text: "Service",
                 items: [
                     { text: "Labor" },
                     { text: "Installation" },
                     { text: "Removal Service" },
                     { text: "Travel" },
                     { text: "Ladder" },
                     { text: "Service Call" },
                 ]
             },
             { text: "Discount" }
            ]
        }); 

Screen shot for reference:

enter image description here

like image 926
GoSmash Avatar asked Jun 01 '18 15:06

GoSmash


1 Answers

I have tested a similar scenario at my side and it worked correctly in my case. Here is my test dojo. Would you please review it and let me know if your scenario is different or if it still doesn't works correctly.

like image 133
Plamen Zdravkov Avatar answered Oct 17 '22 15:10

Plamen Zdravkov