MVC TreeView control with the.HierarchicalDataSource

2 posts, 0 answers
  1. Ken Cox
    Ken Cox avatar
    101 posts
    Member since:
    Oct 2002

    Posted 23 Mar Link to this post

    I'm trying to use the Telerik MVC TreeView control with the kendo.data.HierarchicalDataSource control and local data.

    In samples for the Kendo Treeview, they point to the Javascript datasource like this:

    dataSource: homogeneous

    What syntax do I use in the fluent MVC TreeView to reference data that's held in a JavaScript variable?

    Showing my hierarchical data below.

    Thanks,

    Ken

       "bodyType":"ESTATE",
       "capCode":"VWTI20SE5EDTM4",
       "capID":null,
       "co2Emissions":"167",
       "colour":"SILVER",
       "cylinderCapacity":"1968 cc",
       "dateFirstUsed":"23 July 2009",
       "dateOfFirstRegistration":"23 JULY 2009",
       "description":"2009 Volkswagen Tiguan Se Tdi (140) 4MOTION, 1968CC Diesel, 5DR, Manual",
       "engineSize":"1968CC",
       "fuel":"Diesel",
       "fuelType":"DIESEL",
       "imported":"false",
       "insuranceGroup":"09",
       "licencePlate":"mt09nks",
       "make":"Volkswagen",
       "model":"Tiguan",
       "mot":true,
       "motDetails":"Expires: 28 April 2017",
       "motTestReports":[ 
          { 
             "motTestNumber":244794981138,
             "testResult":"Pass",
             "testDate":"29 April 2016",
             "odometerReading":80084,
             "expiryDate":"28 April 2017",
             "advisoryItems":[ 
     
             ],
             "failureItems":[ 
     
             ]
          },
          { 
             "motTestNumber":938552815158,
             "testResult":"Pass",
             "testDate":"22 April 2015",
             "odometerReading":74998,
             "expiryDate":"21 April 2016",
             "advisoryItems":[ 
     
             ],
             "failureItems":[ 
     
             ]
          },
          { 
             "motTestNumber":157384685012,
             "testResult":"Fail",
             "testDate":"25 March 2015",
             "odometerReading":74813,
             "expiryDate":"",
             "advisoryItems":[ 
                "Front Brake pad(s) wearing thin (3.5.1g)",
                "Front brake disc worn, pitted or scored, but not seriously weakened (3.5.1i)",
                "Rear brake disc worn, pitted or scored, but not seriously weakened (3.5.1i)",
                "Rear Brake pad(s) wearing thin (3.5.1g)",
                "Nearside Front Suspension arm rubber bush deteriorated but not resulting in excessive movement (2.4.G.2)",
                "Offside Front Suspension arm rubber bush deteriorated but not resulting in excessive movement (2.4.G.2)"
             ],
             "failureItems":[ 
                "Nearside Front Tyre tread depth below requirements of 1.6mm (4.1.E.1)",
                "Offside Front Tyre tread depth below requirements of 1.6mm (4.1.E.1)",
                "Front Brakes imbalanced across an axle (3.7.B.5b)",
                "Nearside Front Windscreen wiper does not clear the windscreen effectively (8.2.2)"
             ]
          },
          { 
             "motTestNumber":195455474181,
             "testResult":"Pass",
             "testDate":"24 June 2014",
             "odometerReading":63643,
             "expiryDate":"23 July 2015",
             "advisoryItems":[ 
     
             ],
             "failureItems":[ 
     
             ]
          },
          { 
             "motTestNumber":198414503254,
             "testResult":"Pass",
             "testDate":"23 July 2013",
             "odometerReading":52191,
             "expiryDate":"23 July 2014",
             "advisoryItems":[ 
     
             ],
             "failureItems":[ 
     
             ]
          },
          { 
             "motTestNumber":945398182180,
             "testResult":"Pass",
             "testDate":"6 July 2012",
             "odometerReading":308600,
             "expiryDate":"23 July 2013",
             "advisoryItems":[ 
     
             ],
             "failureItems":[ 
     
             ]
          }
       ],
       "numberOfDoors":"5",
       "numberOfSeats":"5",
       "price":"6465.0",
       "steering":"RHD",
       "transmission":"MANUAL",
       "typeApproval":"M1",
       "vin":"WVGZZZ5NZAW007903",
       "year":"2009",
       "yearOfManufacture":"2009"
    }
  2. Nencho
    Admin
    Nencho avatar
    1671 posts

    Posted 27 Mar Link to this post

    Hello Ken,

    In MVC scenario, you would need to have a Controller, responsible for the data population and call it, using the Read method of the DataSource. An example of this implementation could be found in the Binding to Remote Data demo of the TreeView:

    http://demos.telerik.com/aspnet-mvc/treeview/remote-data-binding

    Hope this information helps.

    Regards,
    Nencho
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top