diff --git a/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/node-url-core.cs b/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/node-url-core.cs new file mode 100644 index 0000000000..b3c161cbad --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/node-url-core.cs @@ -0,0 +1,52 @@ +public IActionResult CheckBox() + { + List treedata = new List(); + treedata.Add(new + { + Id = 1, + Name = "Vue", + HasChild = true, + Expanded = true, + NavigateUrl: 'https://ej2.syncfusion.com/vue/documentation/treeview/getting-started' + }); + treedata.Add(new + { + Id = 2, + Pid = 1, + Name = "JavaScript", + NavigateUrl: 'https://ej2.syncfusion.com/javascript/documentation/treeview/es5-getting-started' + + }); + treedata.Add(new + { + Id = 3, + Pid = 1, + Name = "ASP.NET Core", + NavigateUrl: 'https://ej2.syncfusion.com/aspnetcore/documentation/treeview/getting-started', + }); + + treedata.Add(new + { + Id = 4, + Name: 'Angular', + HasChild: true, + NavigateUrl: 'https://ej2.syncfusion.com/angular/documentation/treeview/getting-started', + }); + treedata.Add(new + { + Id: 5, + Pid: 4, + Name: 'Blazor', + NavigateUrl: 'https://blazor.syncfusion.com/documentation/treeview/getting-started-webapp', + + }); + treedata.Add(new + { + Id: 6, + Pid: 4, + Name: 'React', + NavigateUrl:'https://ej2.syncfusion.com/react/documentation/treeview/getting-started', + }); + ViewBag.dataSource = treedata; + return View(); + } diff --git a/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/node-url-mvc.cs b/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/node-url-mvc.cs new file mode 100644 index 0000000000..175e507000 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/node-url-mvc.cs @@ -0,0 +1,54 @@ +using Syncfusion.EJ2.Navigations; + +public ActionResult CheckBox() +{ + List treedata = new List(); + treedata.Add(new + { + Id = 1, + Name = "Vue", + HasChild = true, + Expanded = true, + NavigateUrl: 'https://ej2.syncfusion.com/vue/documentation/treeview/getting-started' + }); + treedata.Add(new + { + Id = 2, + Pid = 1, + Name = "JavaScript", + NavigateUrl: 'https://ej2.syncfusion.com/javascript/documentation/treeview/es5-getting-started' + + }); + treedata.Add(new + { + Id = 3, + Pid = 1, + Name = "ASP.NET Core", + NavigateUrl: 'https://ej2.syncfusion.com/aspnetcore/documentation/treeview/getting-started', + }); + + treedata.Add(new + { + Id = 4, + Name: 'Angular', + HasChild: true, + NavigateUrl: 'https://ej2.syncfusion.com/angular/documentation/treeview/getting-started', + }); + treedata.Add(new + { + Id: 5, + Pid: 4, + Name: 'Blazor', + NavigateUrl: 'https://blazor.syncfusion.com/documentation/treeview/getting-started-webapp', + + }); + treedata.Add(new + { + Id: 6, + Pid: 4, + Name: 'React', + NavigateUrl:'https://ej2.syncfusion.com/react/documentation/treeview/getting-started', + }); + ViewBag.dataSource = treedata; + return View(); +} diff --git a/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/razor b/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/razor new file mode 100644 index 0000000000..e36b18b275 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/razor @@ -0,0 +1,3 @@ +@Html.EJS().TreeView("treedata").Fields(field=> + field.Id("Id").ParentID("Pid").Text("Name").HasChildren("HasChild").Expanded("Expanded").NavigateUrl("NavigateUrl") + .DataSource(ViewBag.dataSource)).Render() \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/tagHelper b/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/tagHelper new file mode 100644 index 0000000000..4f634931eb --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/treeview/how-to/navigate-url-node-cs1/tagHelper @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/treeview/how-to/assign-url-to-node.md b/ej2-asp-core-mvc/treeview/how-to/assign-url-to-node.md new file mode 100644 index 0000000000..93d6f401ae --- /dev/null +++ b/ej2-asp-core-mvc/treeview/how-to/assign-url-to-node.md @@ -0,0 +1,38 @@ +--- +layout: post +title: How to Assign URLs to TreeView Nodes in ##Platform_Name## TreeView component | Syncfusion +description: Learn here all about Assign URLs to specific nodes in Syncfusion ##Platform_Name## TreeView component of Syncfusion Essential JS 2 and more. +platform: ej2-vue +control: ej2-asp-core-mvc +documentation: ug +domainurl: ##DomainURL## +--- + +# How to Assign URLs to TreeView Nodes in TreeView component + +{% if page.publishingplatform == "aspnet-core" %} + +You can able to assign url to the nodes of TreeView by using [NavigateUrl](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Navigations.TreeViewFieldsSettings.html#Syncfusion_EJ2_Navigations_TreeViewFieldsSettings_NavigateUrl) in field property. + +{% tabs %} +{% highlight cshtml tabtitle="CSHTML" %} +{% include code-snippet/treeview/how-to/navigate-url-node-cs1/tagHelper %} +{% endhighlight %} +{% highlight c# tabtitle="Nodecheck.cs" %} +{% include code-snippet/treeview/how-to/navigate-url-node-cs1/node-url-core.cs %} +{% endhighlight %} +{% endtabs %} + +{% elsif page.publishingplatform == "aspnet-mvc" %} + +You can able to assign url to the nodes of TreeView by using [NavigateUrl](https://help.syncfusion.com/cr/aspnetmvc-js2/Syncfusion.EJ2.Navigations.TreeViewFieldsSettings.html#Syncfusion_EJ2_Navigations_TreeViewFieldsSettings_NavigateUrl) in field property. + +{% tabs %} +{% highlight razor tabtitle="CSHTML" %} +{% include code-snippet/treeview/how-to/navigate-url-node-cs1/razor %} +{% endhighlight %} +{% highlight c# tabtitle="Nodecheck.cs" %} +{% include code-snippet/treeview/how-to/navigate-url-node-cs1/node-url-mvc.cs %} +{% endhighlight %} +{% endtabs %} +{% endif %} diff --git a/ej2-asp-core-toc.html b/ej2-asp-core-toc.html index b2d835b34f..c873d3fcd9 100644 --- a/ej2-asp-core-toc.html +++ b/ej2-asp-core-toc.html @@ -3112,6 +3112,7 @@
  • Customize The Tree Nodes Based On Levels
  • Restrict The Drag-and-Drop For Particular Tree Nodes
  • Nodes manipulation
  • +
  • Assign navigate URL to nodes
  • Migration From Essential JS 1
  • diff --git a/ej2-asp-mvc-toc.html b/ej2-asp-mvc-toc.html index 0b19e2837a..d7914a34bb 100644 --- a/ej2-asp-mvc-toc.html +++ b/ej2-asp-mvc-toc.html @@ -3078,6 +3078,7 @@
  • Customize The Tree Nodes Based On Levels
  • Restrict The Drag-and-Drop For Particular Tree Nodes
  • Nodes manipulation
  • +
  • Assign navigate URL to nodes
  • Migration From Essential JS 1