We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Using Template for a ejTreeview

Thread ID:

Created:

Updated:

Platform:

Replies:

128044 Dec 28,2016 03:50 PM UTC Jan 6,2017 01:58 PM UTC JavaScript 3
loading
Tags: ejTreeView
Suthahar Krishnan
Asked On December 28, 2016 03:50 PM UTC

I am looking for an example to implement a custom template for the ejTreeview.
My requriement is that the child items will have icon image and a slider associated with each of them.
I tried to use the example on :
https://help.syncfusion.com/api/js/ejtreeview#members:template

Need help with a working example.

Karthik Ravichandran [Syncfusion]
Replied On January 2, 2017 01:45 PM UTC

Hi Suthahar, 
 
Thanks for contacting Syncfusion support. 
 
We have analysed your query. We can achieve your requirement (“Child items will have icon image and a slider associated with each of them”) using “template” API in TreeView control. Please refer the below code block: 
[Script] 
  <script id="treeTemplate" type="text/x-jsrender"> 
 
        {{if hasChild}} 
        <div class={{>cls}}>{{>name}}</div> 
        {{else}} 
        <div class="cont-list"> 
            <img class="con-img" src="14.4.0.15/themes/web/content/images/treeview/template-image-{{>imgId}}.png" /> 
            <div class="cont-details"> 
                <b>{{>name}}</b><br /> 
                <span>{{>city}}</span> 
                <br /> 
                <div class="slider" data-value="{{>sliderValue}}" /> 
            </div> 
        </div> 
        {{/if}} 
 
    </script> 
 
 
  $("#treeview").ejTreeView({ 
                fields: { 
                    dataSource: treeData, 
                    id: "id", parentId: "pid", text: "name", hasChild: "hasChild" 
                }, 
                template: "#treeTemplate" 
            }) 
 
 
Based on your requirement we have prepared the sample and it can be available in the below link: 
 
To know more details about template in TreeView control, please refer the below link: 
 
 
Please let us know if you need further assistance. 
 
 
Regards, 
Karthik R 


Suthahar Krishnan
Replied On January 6, 2017 01:03 AM UTC

Thanks!

Karthik Ravichandran [Syncfusion]
Replied On January 6, 2017 01:58 PM UTC

Hi Suthahar, 
 
Most welcome. 
 
Please let us know if you need further assistance. 
 
Regards, 
Karthik R 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;