Node Images
Use the imageMemberPath property to add images to nodes by specifying the name of a property on the data items that contains an image URL.
For example, some our sample items array have an "Image" property set to image URLs:

Trimmers/Shavers
Tablets

Apple
Motorola
Nokia
Samsung
Speakers
Monitors

Shopkins
Train Sets
Science Kit
Play-Doh
Crayola

Coffeee Maker
Breadmaker
Solar Panel
Work Table
Propane Grill
1 2 3 4 5 6 7 | // This file locates: "Scripts/Lesson/C1Nav/Images.js". c1.documentReady(function () { var theTree = wijmo.Control.getControl( '#theTree' ); theTree.displayMemberPath = "Header" ; theTree.childItemsPath = "Items" ; theTree.imageMemberPath = "Image" ; }); |
1 2 3 4 5 6 7 8 9 10 11 | // This file locates: "Content/css/Lesson/C1Nav/Images.css". /* default trees on this sample */ .demo-control .wj-treeview { display:block; height: 350px; font-size: 120%; margin-bottom: 8px; padding: 6px; background: #f0f0f0; box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); } |
1 2 3 4 5 6 7 8 9 10 11 12 13 | using System.Web.Mvc; namespace LearnMvcClient.Controllers { public partial class C1NavController : Controller { // GET: Images public ActionResult Images() { return View(Models.TreeViewData.GetData(Url)); } } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | @model IEnumerable< TreeViewData > < h1 > @Html .Raw(Resources.C1Nav.Images_Title) </ h1 > < p > @Html .Raw(Resources.C1Nav.Images_Text1) </ p > < p > @Html .Raw(Resources.C1Nav.Images_Text2) </ p > @Html .C1().TreeView().Id( "theTree" ).Bind(Model) |