Skip to content

Commit c0bcc89

Browse files
marin-bratanovmarin-bratanov
committed
add select panelbar item exapmle
1 parent 0d199f3 commit c0bcc89

24 files changed

+88187
-0
lines changed

‎panelbar/pre-select-item/README.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# How to Select Panel Bar Item on Load
2+
3+
This project shows two ways you can pre-select a panelbar item when the page (view) loads and when remote data loads.
4+
5+
## Remote Data (Load on Demand)
6+
7+
With remote binding, the panelbar items are traversed and when a text match is found to the data the controller sent (e.g., the current page name), the item is selected.
8+
9+
In this case the item can only be selected after the user has expanded the item that holds the item we want selected - before that it simply is not loaded on the client yet.
10+
11+
This can be suitable for cases where the list of items is very large and you don't want it to load/render initially.
12+
13+
## Local Data
14+
15+
You can bind to local data provided by the controller as the view loads. This lets you set a property in the model for the item you want selected, and use it to indicate it as selected on the client, and then expand all its parents so it is visible.
16+
17+
This approach renders HTML elements for the panelbar items from the server which may be better for SEO or screen readers, but if there are many items it may slow down or bloat the page.

‎panelbar/pre-select-item/lib/KENDOUIMVC/2019.1.115.Trial/Kendo.Mvc.dll

2.15 MB
Binary file not shown.

‎panelbar/pre-select-item/lib/KENDOUIMVC/2019.1.115.Trial/Kendo.Mvc.xml

+87,412
Large diffs are not rendered by default.

‎panelbar/pre-select-item/pre-select-panelbar-item.sln

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
2+
Microsoft Visual Studio Solution File, Format Version 12.00
3+
# Visual Studio 15
4+
VisualStudioVersion = 15.0.28307.102
5+
MinimumVisualStudioVersion = 10.0.40219.1
6+
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "pre-select-panelbar-item", "pre-select-panelbar-item\pre-select-panelbar-item.csproj", "{B7903F27-5F1F-44DE-B4B8-F56779BE4D22}"
7+
EndProject
8+
Global
9+
GlobalSection(SolutionConfigurationPlatforms) = preSolution
10+
Debug|Any CPU = Debug|Any CPU
11+
Release|Any CPU = Release|Any CPU
12+
EndGlobalSection
13+
GlobalSection(ProjectConfigurationPlatforms) = postSolution
14+
{B7903F27-5F1F-44DE-B4B8-F56779BE4D22}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
15+
{B7903F27-5F1F-44DE-B4B8-F56779BE4D22}.Debug|Any CPU.Build.0 = Debug|Any CPU
16+
{B7903F27-5F1F-44DE-B4B8-F56779BE4D22}.Release|Any CPU.ActiveCfg = Release|Any CPU
17+
{B7903F27-5F1F-44DE-B4B8-F56779BE4D22}.Release|Any CPU.Build.0 = Release|Any CPU
18+
EndGlobalSection
19+
GlobalSection(SolutionProperties) = preSolution
20+
HideSolutionNode = FALSE
21+
EndGlobalSection
22+
GlobalSection(ExtensibilityGlobals) = postSolution
23+
SolutionGuid = {4C371813-0C4D-4ADF-8AC0-269A69659916}
24+
EndGlobalSection
25+
EndGlobal

‎panelbar/pre-select-item/pre-select-panelbar-item/App_Start/FilterConfig.cs

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
using System.Web;
2+
using System.Web.Mvc;
3+
4+
namespace panelbar_hierarchy_binding
5+
{
6+
public class FilterConfig
7+
{
8+
public static void RegisterGlobalFilters(GlobalFilterCollection filters)
9+
{
10+
filters.Add(new HandleErrorAttribute());
11+
}
12+
}
13+
}

‎panelbar/pre-select-item/pre-select-panelbar-item/App_Start/RouteConfig.cs

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web;
5+
using System.Web.Mvc;
6+
using System.Web.Routing;
7+
8+
namespace panelbar_hierarchy_binding
9+
{
10+
public class RouteConfig
11+
{
12+
public static void RegisterRoutes(RouteCollection routes)
13+
{
14+
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
15+
16+
routes.MapRoute(
17+
name: "Default",
18+
url: "{controller}/{action}/{id}",
19+
defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
20+
);
21+
}
22+
}
23+
}

‎panelbar/pre-select-item/pre-select-panelbar-item/App_Start/WebApiConfig.cs

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web.Http;
5+
6+
namespace panelbar_hierarchy_binding
7+
{
8+
public static class WebApiConfig
9+
{
10+
public static void Register(HttpConfiguration config)
11+
{
12+
config.Routes.MapHttpRoute(
13+
name: "DefaultApi",
14+
routeTemplate: "api/{controller}/{id}",
15+
defaults: new { id = RouteParameter.Optional }
16+
);
17+
}
18+
}
19+
}

‎panelbar/pre-select-item/pre-select-panelbar-item/Controllers/HomeController.cs

+111
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,111 @@
1+
using Kendo.Mvc.UI;
2+
using pre_select_panelbar_item.Models;
3+
using System;
4+
using System.Collections.Generic;
5+
using System.Linq;
6+
using System.Web;
7+
using System.Web.Mvc;
8+
9+
namespace PanelBarHierarchyBinding.Controllers
10+
{
11+
public class HomeController : Controller
12+
{
13+
public ActionResult Index()
14+
{
15+
return View();
16+
}
17+
18+
public ActionResult LocalData()
19+
{
20+
ViewBag.ItemToSelect = "Second";
21+
22+
List<LocalPanelBarItem> pbItems = new List<LocalPanelBarItem>() {
23+
new LocalPanelBarItem
24+
{
25+
MenuName="First",
26+
MenuUrl = "firstUrl",
27+
ChildItems = new List<LocalPanelBarItem>() {
28+
new LocalPanelBarItem
29+
{
30+
MenuName="Child one of 1",
31+
MenuUrl = "thirdUrl",
32+
IsPreSelected = true
33+
},
34+
new LocalPanelBarItem
35+
{
36+
MenuName="Child two of 1",
37+
MenuUrl = "fourthUrl"
38+
}
39+
}
40+
},
41+
new LocalPanelBarItem
42+
{
43+
MenuName="Second",
44+
MenuUrl = "secondUrl"
45+
},
46+
};
47+
48+
ViewBag.MyPanelBarItems = pbItems;
49+
50+
return View();
51+
}
52+
53+
public ActionResult RemoteData()
54+
{
55+
ViewBag.ItemToSelect = "Second";
56+
return View();
57+
}
58+
59+
public JsonResult ReadMenu(int? MenuId)
60+
{
61+
if (!MenuId.HasValue)
62+
{
63+
List<RemoteDataPanelBarItem> rootItems = new List<RemoteDataPanelBarItem>() {
64+
new RemoteDataPanelBarItem
65+
{
66+
MenuHasChild=true,
67+
MenuId=1,
68+
MenuName="First",
69+
MenuParentId=null,
70+
MenuUrl = "firstUrl"
71+
},
72+
new RemoteDataPanelBarItem
73+
{
74+
MenuHasChild=false,
75+
MenuId=2,
76+
MenuName="Second",
77+
MenuParentId=null,
78+
MenuUrl = "secondUrl"
79+
},
80+
};
81+
82+
return Json(rootItems, JsonRequestBehavior.AllowGet);
83+
84+
}
85+
else
86+
{
87+
List<RemoteDataPanelBarItem> childItems = new List<RemoteDataPanelBarItem>() {
88+
new RemoteDataPanelBarItem
89+
{
90+
MenuHasChild=false,
91+
MenuId=3,
92+
MenuName="Child one of " + MenuId,
93+
MenuParentId=1,
94+
MenuUrl = "thirdUrl"
95+
},
96+
new RemoteDataPanelBarItem
97+
{
98+
MenuHasChild=false,
99+
MenuId=4,
100+
MenuName="Child two of " + MenuId,
101+
MenuParentId=1,
102+
MenuUrl = "fourthUrl"
103+
}
104+
};
105+
106+
return Json(childItems, JsonRequestBehavior.AllowGet);
107+
}
108+
}
109+
110+
}
111+
}

‎panelbar/pre-select-item/pre-select-panelbar-item/Global.asax

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<%@ Application Codebehind="Global.asax.cs" Inherits="panelbar_hierarchy_binding.MvcApplication" Language="C#" %>

‎panelbar/pre-select-item/pre-select-panelbar-item/Global.asax.cs

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web;
5+
using System.Web.Http;
6+
using System.Web.Mvc;
7+
using System.Web.Routing;
8+
9+
namespace panelbar_hierarchy_binding
10+
{
11+
// Note: For instructions on enabling IIS6 or IIS7 classic mode,
12+
// visit http://go.microsoft.com/?LinkId=9394801
13+
public class MvcApplication : System.Web.HttpApplication
14+
{
15+
protected void Application_Start()
16+
{
17+
AreaRegistration.RegisterAllAreas();
18+
19+
WebApiConfig.Register(GlobalConfiguration.Configuration);
20+
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
21+
RouteConfig.RegisterRoutes(RouteTable.Routes);
22+
}
23+
}
24+
}

‎panelbar/pre-select-item/pre-select-panelbar-item/Models/LocalPanelBarItem.cs

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web;
5+
6+
namespace pre_select_panelbar_item.Models
7+
{
8+
public class LocalPanelBarItem
9+
{
10+
public string MenuName { get; set; }
11+
public string MenuUrl { get; set; }
12+
public List<LocalPanelBarItem> ChildItems { get; set; }
13+
public bool IsPreSelected { get; set; }
14+
}
15+
}

‎panelbar/pre-select-item/pre-select-panelbar-item/Models/RemoteDataPanelBarItem.cs

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Web;
5+
6+
namespace pre_select_panelbar_item.Models
7+
{
8+
public class RemoteDataPanelBarItem
9+
{
10+
public string MenuName { get; set; }
11+
public string MenuUrl { get; set; }
12+
public int MenuId { get; set; }
13+
public bool MenuHasChild { get; set; }
14+
public int? MenuParentId { get; set; }
15+
}
16+
}

‎panelbar/pre-select-item/pre-select-panelbar-item/Properties/AssemblyInfo.cs

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
using System.Reflection;
2+
using System.Runtime.CompilerServices;
3+
using System.Runtime.InteropServices;
4+
5+
// General Information about an assembly is controlled through the following
6+
// set of attributes. Change these attribute values to modify the information
7+
// associated with an assembly.
8+
[assembly: AssemblyTitle("panelbar_hierarchy_binding")]
9+
[assembly: AssemblyDescription("")]
10+
[assembly: AssemblyConfiguration("")]
11+
[assembly: AssemblyCompany("")]
12+
[assembly: AssemblyProduct("panelbar_hierarchy_binding")]
13+
[assembly: AssemblyCopyright("Copyright © 2016")]
14+
[assembly: AssemblyTrademark("")]
15+
[assembly: AssemblyCulture("")]
16+
17+
// Setting ComVisible to false makes the types in this assembly not visible
18+
// to COM components. If you need to access a type in this assembly from
19+
// COM, set the ComVisible attribute to true on that type.
20+
[assembly: ComVisible(false)]
21+
22+
// The following GUID is for the ID of the typelib if this project is exposed to COM
23+
[assembly: Guid("262a73fb-0ebb-42c9-ad74-2f9d10ca309c")]
24+
25+
// Version information for an assembly consists of the following four values:
26+
//
27+
// Major Version
28+
// Minor Version
29+
// Build Number
30+
// Revision
31+
//
32+
// You can specify all the values or you can default the Revision and Build Numbers
33+
// by using the '*' as shown below:
34+
[assembly: AssemblyVersion("1.0.0.0")]
35+
[assembly: AssemblyFileVersion("1.0.0.0")]

‎panelbar/pre-select-item/pre-select-panelbar-item/Views/Home/Index.cshtml

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
2+
@Html.ActionLink("see example with remote data binding", "RemoteData", "Home")
3+
<br />
4+
@Html.ActionLink("see example with local data binding and HTML rendered from the server", "LocalData", "Home")

‎panelbar/pre-select-item/pre-select-panelbar-item/Views/Home/LocalData.cshtml

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
@using Kendo.Mvc.UI.Fluent
2+
3+
@{
4+
ViewBag.Title = "LocalData";
5+
}
6+
7+
<h2>LocalData</h2>
8+
9+
10+
@(Html.Kendo().PanelBar()
11+
.Name("PanelBarNavigation")
12+
.BindTo((IEnumerable<pre_select_panelbar_item.Models.LocalPanelBarItem>)ViewBag.MyPanelBarItems, (NavigationBindingFactory<PanelBarItem> mappings) =>
13+
{
14+
mappings.For<pre_select_panelbar_item.Models.LocalPanelBarItem>(binding => binding.ItemDataBound((item, dataItemFromModel) =>
15+
{
16+
item.Text = dataItemFromModel.MenuName;
17+
item.Url = dataItemFromModel.MenuUrl;
18+
item.Selected = (dataItemFromModel.IsPreSelected == true);
19+
if (item.Selected)
20+
{
21+
PanelBarItem currItem = item;
22+
while (currItem.Parent != null)
23+
{
24+
currItem.Parent.Expanded = true;
25+
currItem = currItem.Parent;
26+
}
27+
}
28+
29+
})
30+
.Children(itm => itm.ChildItems));
31+
})
32+
)

‎panelbar/pre-select-item/pre-select-panelbar-item/Views/Home/RemoteData.cshtml

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
@{
2+
ViewBag.Title = "RemoteData";
3+
}
4+
5+
<h2>RemoteData</h2>
6+
7+
@(Html.Kendo().PanelBar()
8+
.Name("MenuBar")
9+
.DataTextField("MenuName")
10+
.DataUrlField("MenuUrl")
11+
.Events(Event => Event.Select("onSelect").DataBound("onDataBound"))
12+
.DataSource(dataSource => dataSource
13+
.Model(Model =>
14+
{
15+
Model.Id("MenuId");
16+
Model.HasChildren("MenuHasChild");
17+
})
18+
.Read(Read => Read.Action("ReadMenu", "Home")))
19+
)
20+
21+
22+
<script>
23+
function onSelect() { }
24+
function onDataBound(e) {
25+
var desiredItemText = "@ViewBag.ItemToSelect";
26+
27+
//uncomment these for easy testing of the behavior without rebuilding
28+
//desiredItemText = "Child one of 1"; //with this one, it can only get selected when it loads after "First" expands
29+
//desiredItemText = "First";
30+
var panelBar = e.sender;
31+
panelBar.wrapper.find("li[role='menuitem'] > a.k-link").each(function (index, elem) {
32+
var $elem = $(elem);
33+
if ($elem.text() == desiredItemText) {
34+
panelBar.select($elem.parents("li[role='menuitem']").first());
35+
}
36+
});
37+
}
38+
</script>

0 commit comments

Comments
 (0)