Skip to content

Commit af7ab6a

Browse files
alestoyaalestoya
committed
chore(demos): add hierarchy grid signalr example
1 parent e467673 commit af7ab6a

File tree

6 files changed

+325
-0
lines changed

6 files changed

+325
-0
lines changed

‎Telerik.Examples.Mvc/Telerik.Examples.Mvc/Controllers/Grid/HierarchySignalRController.cs‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
using Microsoft.AspNetCore.Mvc;
2+
3+
namespace Telerik.Examples.Mvc.Controllers.Grid
4+
{
5+
public class HierarchySignalRController : Controller
6+
{
7+
public IActionResult HierarchySignalR()
8+
{
9+
return View();
10+
}
11+
}
12+
}

‎Telerik.Examples.Mvc/Telerik.Examples.Mvc/Hubs/ChildGridHub.cs‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
using Microsoft.AspNetCore.Mvc;
2+
using Microsoft.AspNetCore.SignalR;
3+
using System.Collections.Generic;
4+
using System.Linq;
5+
using System;
6+
using System.Threading.Tasks;
7+
using Telerik.Examples.Mvc.Models;
8+
9+
namespace Telerik.Examples.Mvc.Hubs
10+
{
11+
public class ChildGridHub : Hub
12+
{
13+
public override System.Threading.Tasks.Task OnConnectedAsync()
14+
{
15+
Groups.AddToGroupAsync(Context.ConnectionId, GetGroupName());
16+
return base.OnConnectedAsync();
17+
}
18+
19+
public override System.Threading.Tasks.Task OnDisconnectedAsync(Exception e)
20+
{
21+
Groups.RemoveFromGroupAsync(Context.ConnectionId, GetGroupName());
22+
return base.OnDisconnectedAsync(e);
23+
}
24+
25+
public IEnumerable<Person> Read(HierarchyRequestModel request)
26+
=> Enumerable.Range(1, 10).Select(i => new Person
27+
{
28+
PersonID = i,
29+
BirthDate = DateTime.Now.AddDays(i),
30+
ProductID = i % 2 == 0 ? 1 : 2,
31+
Name = "Name" + i
32+
})
33+
.Where(person => person.ProductID == request.ProductID)
34+
.ToList();
35+
36+
public Person Create(Person person)
37+
{
38+
Clients.OthersInGroup(GetGroupName()).SendAsync("create", person);
39+
return person;
40+
}
41+
42+
public void Update(Person person)
43+
=> Clients.OthersInGroup(GetGroupName()).SendAsync("update", person);
44+
45+
public void Destroy(Person person)
46+
=> Clients.OthersInGroup(GetGroupName()).SendAsync("destroy", person);
47+
public string GetGroupName()
48+
=> GetRemoteIpAddress();
49+
50+
public string GetRemoteIpAddress()
51+
=> Context.GetHttpContext()?.Connection.RemoteIpAddress.ToString();
52+
}
53+
}

‎Telerik.Examples.Mvc/Telerik.Examples.Mvc/Hubs/ParentGridHub.cs‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
using Microsoft.AspNetCore.SignalR;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System;
5+
using Telerik.Examples.Mvc.Models;
6+
using Product = Telerik.Examples.Mvc.Models.Product;
7+
8+
namespace Telerik.Examples.Mvc.Hubs
9+
{
10+
public class ParentGridHub : Hub
11+
{
12+
private Random _randomHelper { get; set; }
13+
14+
public ParentGridHub()
15+
{
16+
_randomHelper = new Random();
17+
}
18+
19+
public override System.Threading.Tasks.Task OnConnectedAsync()
20+
{
21+
Groups.AddToGroupAsync(Context.ConnectionId, GetGroupName());
22+
return base.OnConnectedAsync();
23+
}
24+
25+
public override System.Threading.Tasks.Task OnDisconnectedAsync(Exception e)
26+
{
27+
Groups.RemoveFromGroupAsync(Context.ConnectionId, GetGroupName());
28+
return base.OnDisconnectedAsync(e);
29+
}
30+
31+
public IEnumerable<Product> Read()
32+
=> Enumerable.Range(1, 2).Select(i => new Product
33+
{
34+
Discontinued = i % 2 == 1,
35+
ProductID = i,
36+
ProductName = "Product" + i,
37+
UnitPrice = _randomHelper.Next(1, 1000),
38+
UnitsInStock = _randomHelper.Next(1, 1000),
39+
UnitsOnOrder = _randomHelper.Next(1, 1000)
40+
}).ToList();
41+
42+
public Product Create(Product product)
43+
{
44+
Clients.OthersInGroup(GetGroupName()).SendAsync("create", product);
45+
return product;
46+
}
47+
48+
public void Update(Product product)
49+
=> Clients.OthersInGroup(GetGroupName()).SendAsync("update", product);
50+
51+
public void Destroy(Product product)
52+
=> Clients.OthersInGroup(GetGroupName()).SendAsync("destroy", product);
53+
54+
public string GetGroupName()
55+
=> GetRemoteIpAddress();
56+
57+
public string GetRemoteIpAddress()
58+
=> Context.GetHttpContext()?.Connection.RemoteIpAddress.ToString();
59+
}
60+
}

‎Telerik.Examples.Mvc/Telerik.Examples.Mvc/Models/HierarchyRequestModel.cs‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
namespace Telerik.Examples.Mvc.Models
2+
{
3+
public class HierarchyRequestModel
4+
{
5+
public int ProductID { get; set; }
6+
}
7+
}

‎Telerik.Examples.Mvc/Telerik.Examples.Mvc/Program.cs‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -189,6 +189,8 @@
189189
{
190190
endpoints.MapHub<MeetingHub>("/meetingHub");
191191
endpoints.MapHub<GridHub>("/gridHub");
192+
endpoints.MapHub<ParentGridHub>("/parentGridHub");
193+
endpoints.MapHub<ChildGridHub>("/childGridHub");
192194
endpoints.MapControllerRoute(
193195
name: "default",
194196
pattern: "{controller=Home}/{action=Index}/{id?}");

‎Telerik.Examples.Mvc/Telerik.Examples.Mvc/Views/Grid/HierarchySignalR.cshtml‎

Lines changed: 191 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,191 @@
1+
2+
<script src="~/js/signalr/dist/browser/signalr.min.js"></script>
3+
4+
<script>
5+
// SignalR configuration.
6+
7+
var parentHubUrl = "/parentGridHub";
8+
9+
var parentGridConnection = new signalR.HubConnectionBuilder()
10+
.withUrl(parentHubUrl, {
11+
transport: signalR.HttpTransportType.LongPolling
12+
})
13+
.build();
14+
15+
var parentGridConnectionStart = parentGridConnection.start()
16+
17+
var childHubUrl = "/childGridHub";
18+
19+
var childGridConnection = new signalR.HubConnectionBuilder()
20+
.withUrl(childHubUrl, {
21+
transport: signalR.HttpTransportType.LongPolling
22+
})
23+
.build();
24+
25+
var childGridConnectionStart = childGridConnection.start();
26+
27+
</script>
28+
29+
<div id="notification-container"></div>
30+
@(Html.Kendo().Notification() // Notification for CRUD operations of both the child and parent Grid components.
31+
.Name("notification")
32+
.Height("30%")
33+
.Width("50%")
34+
.AppendTo("#notification-container")
35+
)
36+
37+
@(Html.Kendo().Grid<Product>() // Parent Grid.
38+
.Name("grid")
39+
.DataSource(dataSource => dataSource
40+
.SignalR()
41+
.AutoSync(false)
42+
.Events(events => events.RequestEnd("onEnd"))
43+
.Transport(tr => tr
44+
.Promise("parentGridConnectionStart")
45+
.Hub("parentGridConnection")
46+
.Client(c => c
47+
.Read("read")
48+
.Create("create")
49+
.Update("update")
50+
.Destroy("destroy"))
51+
.Server(s => s
52+
.Read("read")
53+
.Create("create")
54+
.Update("update")
55+
.Destroy("destroy"))
56+
)
57+
.Schema(schema => schema
58+
.Model(model => {
59+
model.Id(id => id.ProductID);
60+
model.Field(field => field.ProductID).Editable(false);
61+
model.Field(field => field.ProductName);
62+
model.Field(field => field.UnitsInStock);
63+
model.Field(field => field.Discontinued);
64+
model.Field(field => field.UnitPrice);
65+
model.Field(field => field.UnitsOnOrder);
66+
})
67+
)
68+
.PageSize(10)
69+
)
70+
.Events(events => events.DetailInit("onDetailInit"))
71+
.Editable(editable => editable.Mode(GridEditMode.InLine))
72+
.ToolBar(t => t.Create())
73+
.Columns(columns =>
74+
{
75+
columns.Bound(product => product.ProductID);
76+
columns.Bound(product => product.ProductName);
77+
columns.Bound(product => product.UnitsInStock);
78+
columns.Bound(product => product.Discontinued);
79+
columns.Bound(product => product.UnitPrice);
80+
columns.Bound(product => product.UnitsOnOrder);
81+
columns.Command(command =>
82+
{
83+
command.Edit();
84+
command.Destroy();
85+
});
86+
})
87+
.Pageable()
88+
.Sortable()
89+
.Filterable()
90+
.Groupable()
91+
.ClientDetailTemplateId("OrdersTemplate")
92+
)
93+
94+
<script type="text/kendo" id="OrdersTemplate">
95+
@(Html.Kendo().Grid<Person>() // Child Grid.
96+
.Name("People#=ProductID#")
97+
.Columns(columns =>
98+
{
99+
columns.Bound(o => o.PersonID);
100+
columns.Bound(o => o.Name);
101+
columns.Bound(o => o.BirthDate).Format("{0:d}");
102+
columns.Command(command =>
103+
{
104+
command.Edit();
105+
command.Destroy();
106+
});
107+
})
108+
.ToolBar(toolbar => toolbar.Create())
109+
.Editable(editable => editable.Mode(GridEditMode.InLine))
110+
.Pageable().Sortable().Filterable()
111+
.AutoBind(false) // AutoBind is required to be set to false in order for the parent ID identifier to be supplemented programmatically.
112+
.DataSource(dataSource => dataSource
113+
.SignalR()
114+
.AutoSync(false)
115+
.Events(events => events.RequestEnd("onEnd2"))
116+
.Transport(tr => tr
117+
.ParameterMap("onMap")
118+
.Promise("childGridConnectionStart")
119+
.Hub("childGridConnection")
120+
.Client(c => c
121+
.Read("read")
122+
.Create("create")
123+
.Update("update")
124+
.Destroy("destroy")
125+
)
126+
.Server(s => s
127+
.Read("read")
128+
.Create("create")
129+
.Update("update")
130+
.Destroy("destroy")
131+
)
132+
)
133+
.Schema(schema => schema
134+
.Model(model =>
135+
{
136+
model.Id("PersonID");
137+
model.Field("PersonID", typeof(int)).Editable(false);
138+
model.Field("Name", typeof(string));
139+
model.Field("BirthDate", typeof(DateTime));
140+
}))
141+
.PageSize(10)
142+
)
143+
.ToClientTemplate()
144+
)
145+
</script>
146+
147+
<script>
148+
var parentId; // Flag variable for Parent ID unique identifier.
149+
function onDetailInit(e) { // Detail Init is required.
150+
var dataItem = $("#grid").getKendoGrid().dataItem(e.masterRow);
151+
parentId = dataItem.ProductID; // Gather the Parent id unique identifier.
152+
153+
$(e.detailRow).find(".k-grid").getKendoGrid().dataSource.read();
154+
}
155+
function onMap(data, type) {
156+
switch (type) {
157+
case "read": {
158+
return readParameterMap(data, type, parentId)
159+
}
160+
default: {
161+
return data;
162+
}
163+
}
164+
}
165+
166+
function onEnd(e) { // Request End for Parent Grid.
167+
if (e.type == "destroy") {
168+
console.log("here");
169+
$("#notification").getKendoNotification().show("Delete operation has occured for the parent Grid", "success")
170+
} else if (e.type == "update") {
171+
$("#notification").getKendoNotification().show("Update operation has occured for the parent Grid", "success")
172+
} else if (e.type == "create") {
173+
$("#notification").getKendoNotification().show("Create operation has occured for the parent Grid", "success")
174+
}
175+
}
176+
177+
178+
function onEnd2(e) { // Request End for Child Grid.
179+
if (e.type == "destroy") {
180+
$("#notification").getKendoNotification().show("Delete operation has occured for the child Grid", "success")
181+
} else if (e.type == "update") {
182+
$("#notification").getKendoNotification().show("Update operation has occured for the child Grid", "success")
183+
} else if (e.type == "create") {
184+
$("#notification").getKendoNotification().show("Create operation has occured for the child Grid", "success")
185+
}
186+
}
187+
188+
function readParameterMap(data, operation, id) { // Paremeter Map handler for child Grid.
189+
return { ProductID: id };
190+
}
191+
</script>

0 commit comments

Comments
 (0)