ASP.NET - jquery treeview examples in mvc3 razor

Asked By sree goud on 07-Apr-12 01:42 AM
hi all,

any body tell me how to use jquery tree view in mvc3+razor with example
[)ia6l0 iii replied to sree goud on 08-Apr-12 07:02 AM
Should not be tough. But the jQuery treeview plugin has very little dependancy with the ASP.Net MVC3 razor engine. 

To begin with, download the treeview plugin from 
http://jquery.bassistance.de/treeview/jquery.treeview.zip

Add the script reference in your view or the layout file as your design is. 
<script src="@url.content("~/scripts/jquery.treeview.js")" type="text/javascript"></script>

And then add the data in a html element like, 
<ul id="container">
@foreach(var parent in model.parents)
{
 <li>
   <Parent element>
<ul>
@foreach(var child in model.parent.children)
{
   <li>child node</li>
}
</ul>
</li>
}
</ul>

And then add the following line in the document ready function. 
<script type="text/javascript">
 $(function () {
$("#container").treeview();
});
</script>


Hope this helps.