chore(demos): add remote binding listbox example

Author: alestoya

Telerik.Examples.Mvc/Telerik.Examples.Mvc/Controllers/ListBox/RemoteBindingController.cs

@@ -0,0 +1,27 @@
+using Microsoft.AspNetCore.Mvc;
+using System.Linq;
+using Telerik.Examples.Mvc.Database;
+
+namespace Telerik.Examples.Mvc.Controllers.ListBox
+{
+    public class RemoteBindingController : Controller
+    {
+        private readonly InMemoryDbContext _dbContext;
+
+        public RemoteBindingController(InMemoryDbContext dbContext)
+        {
+            _dbContext = dbContext;
+        }
+
+        public IActionResult RemoteBinding()
+        {
+            return View();
+        }
+
+        public IActionResult GetEmployees()
+        {
+            var employees = _dbContext.Employees.ToList();
+            return Json(employees);
+        }
+    }
+}

Telerik.Examples.Mvc/Telerik.Examples.Mvc/Database/InMemoryDbContext.cs

@@ -0,0 +1,20 @@
+using Microsoft.AspNetCore.Mvc.Rendering;
+using Microsoft.EntityFrameworkCore;
+using Telerik.Examples.Mvc.Models;
+
+namespace Telerik.Examples.Mvc.Database
+{
+    public class InMemoryDbContext: DbContext
+    {
+        public InMemoryDbContext(DbContextOptions<InMemoryDbContext> options)
+           : base(options)
+        { }
+
+        protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder)
+        {
+            base.OnConfiguring(optionsBuilder); 
+        }
+
+        public DbSet<EmployeeViewModel> Employees { get; set; }
+    }
+}

Telerik.Examples.Mvc/Telerik.Examples.Mvc/Models/EmployeeViewModel.cs

@@ -1,12 +1,14 @@
 using System;
 using System.Collections.Generic;
+using System.ComponentModel.DataAnnotations;
 using System.Linq;
 using System.Threading.Tasks;
 
 namespace Telerik.Examples.Mvc.Models
 {
     public class EmployeeViewModel
     {
+        [Key]
         public int Id { get; set; }
 
         public string Name { get; set; }

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

@@ -15,6 +15,8 @@
 using Microsoft.AspNetCore.OData;
 using Microsoft.OData.Edm;
 using Microsoft.OData.ModelBuilder;
+using Telerik.Examples.Mvc.Database;
+using Telerik.Examples.Mvc.Seeders;
 
 
 var builder = WebApplication.CreateBuilder(args);
@@ -49,6 +51,7 @@
 
 builder.Services.Configure<RazorViewEngineOptions>(options =>
 {
+    options.ViewLocationFormats.Add("/Views/ListBox/{0}" + RazorViewEngine.ViewExtension);
     options.ViewLocationFormats.Add("/Views/Captcha/{0}" + RazorViewEngine.ViewExtension);
     options.ViewLocationFormats.Add("/Views/Grid/{0}" + RazorViewEngine.ViewExtension);
     options.ViewLocationFormats.Add("/Views/ImageEditor/{0}" + RazorViewEngine.ViewExtension);
@@ -64,6 +67,10 @@
 builder.Services.AddDbContext<GeneralDbContext>(options =>
     options.UseSqlServer(builder.Configuration.GetConnectionString("DefaultConnection")));
 
+builder.Services.AddDbContext<InMemoryDbContext>(options =>
+    options.UseInMemoryDatabase("TelerikCoreDb")
+);
+
 builder.Services.AddDefaultIdentity<IdentityUser>(options =>
 {
     options.SignIn.RequireConfirmedAccount = false;
@@ -84,7 +91,8 @@
 
 builder.Services
     .AddDistributedMemoryCache()
-    .AddSession(opts => {
+    .AddSession(opts =>
+    {
         opts.Cookie.IsEssential = true;
     });
 
@@ -124,9 +132,15 @@
     endpoints.MapRazorPages();
 });
 
-using var serviceScope = app.Services.CreateScope();
-var context = serviceScope.ServiceProvider.GetRequiredService<GeneralDbContext>();
-context.Database.Migrate();
+
+using (var serviceScope = app.Services.CreateScope())
+{
+    var context = serviceScope.ServiceProvider.GetRequiredService<GeneralDbContext>();
+    context.Database.Migrate();
+
+    var inMemoryContext = serviceScope.ServiceProvider.GetRequiredService<InMemoryDbContext>();
+    DataSeeder.SeedListBoxItems(inMemoryContext);
+}
 
 app.Run();
 

Telerik.Examples.Mvc/Telerik.Examples.Mvc/Seeders/DataSeeder.cs

@@ -0,0 +1,33 @@
+using Microsoft.AspNetCore.Mvc.Rendering;
+using Microsoft.EntityFrameworkCore;
+using System.Collections.Generic;
+using System.Linq;
+using Telerik.Examples.Mvc.Database;
+using Telerik.Examples.Mvc.Models;
+
+namespace Telerik.Examples.Mvc.Seeders
+{
+    public class DataSeeder
+    {
+        public static void SeedListBoxItems(InMemoryDbContext dbContext)
+        {
+            if (dbContext.Employees.Any())
+            {
+                return;
+            }
+
+            var employees = new List<EmployeeViewModel>
+            {
+                new EmployeeViewModel(){ Id = 1, Name = "Steven White" },
+                new EmployeeViewModel(){ Id = 2, Name = "Nancy King" },
+                new EmployeeViewModel(){ Id = 3, Name = "Nancy Davolio" },
+                new EmployeeViewModel(){ Id = 4, Name = "Michael Leverling" },
+                new EmployeeViewModel(){ Id = 5, Name = "Andrew Callahan" },
+                new EmployeeViewModel(){ Id = 6, Name = "Michael Suyama" },
+            };
+
+            dbContext.Employees.AddRange(employees);
+            dbContext.SaveChanges();
+        }
+    }
+}

Telerik.Examples.Mvc/Telerik.Examples.Mvc/Telerik.Examples.Mvc.csproj

@@ -12,6 +12,7 @@
     <PackageReference Include="Microsoft.AspNetCore.Mvc.NewtonsoftJson" Version="9.0.2" />
     <PackageReference Include="Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation" Version="9.0.2" />
     <PackageReference Include="Microsoft.AspNetCore.OData" Version="9.2.0" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.InMemory" Version="9.0.2" />
     <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="9.0.2" />
     <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="9.0.2">
       <PrivateAssets>all</PrivateAssets>

Telerik.Examples.Mvc/Telerik.Examples.Mvc/Views/ListBox/RemoteBinding.cshtml

@@ -0,0 +1,55 @@
+<div id="example">
+    <h3 id="heading">Remote Binding</h3>
+    <div class="demo-section wide">
+        @(Html.Kendo().ListBox()
+            .Name("optional")
+            .DataTextField("Name")
+            .DataValueField("Id")
+            .Toolbar(toolbar =>
+            {
+                toolbar.Position(ListBoxToolbarPosition.Right);
+                toolbar.Tools(tools => tools
+                .MoveUp()
+                .MoveDown()
+                .TransferTo()
+                .TransferFrom()
+                .TransferAllTo()
+                .TransferAllFrom()
+                .Remove()
+                );
+            })
+            .ConnectWith("selected")
+            .DataSource(dataSource => dataSource
+                .Read("GetEmployees", "RemoteBinding")
+            )
+        )
+
+        @(Html.Kendo().ListBox()
+            .Name("selected")
+            .DataTextField("Name")
+            .DataValueField("Id")
+            .BindTo(new List<EmployeeViewModel>())
+            .Selectable(ListBoxSelectable.Multiple)
+        )
+    </div>
+</div>
+
+<style>
+    #heading {
+        justify-content: center;
+        display: flex;
+    }
+    #example .demo-section {
+        text-align: center;
+    }
+
+    #example .k-listbox {
+        width: 236px;
+        height: 360px;
+    }
+
+    #example .k-listbox:first-of-type {
+        width: 270px;
+        margin-right: 5px;
+    }
+</style>