add ComboBox demos
This commit is contained in:
DESKTOP-M5A0PQU\Neli
Родитель
7b9df71466
Коммит
8984058e96
|
|
@ -0,0 +1,45 @@
|
|||
@page
|
||||
@model Telerik.Examples.RazorPages.Pages.ComboBox.ComboBoxCrudModel
|
||||
@{
|
||||
ViewData["Title"] = "ComboBoxCrud";
|
||||
}
|
||||
|
||||
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
|
||||
@Html.AntiForgeryToken()
|
||||
|
||||
<h1>ComboBox CrudOperations</h1>
|
||||
|
||||
@(Html.Kendo().ComboBox()
|
||||
.Name("products")
|
||||
.DataTextField("ShipName")
|
||||
.DataValueField("ShipCity")
|
||||
.HtmlAttributes(new { style = "width:300px;" })
|
||||
.Events(e => e.Select("onSelect"))
|
||||
.AutoBind(false)
|
||||
.Filter(FilterType.Contains)
|
||||
.DataSource(ds => ds
|
||||
.Custom()
|
||||
.Transport(transport => transport
|
||||
.Read(r => r
|
||||
.Url("/ComboBox/ComboBoxCrud?handler=Read").Data("dataFunction")
|
||||
))
|
||||
.ServerFiltering(true)
|
||||
)
|
||||
)
|
||||
<script>
|
||||
function onSelect(e) {
|
||||
console.log("You selected item: " + e.item.text());
|
||||
}
|
||||
|
||||
function dataFunction(e) {
|
||||
var filterValue = '';
|
||||
if (e.filter.filters[0]) {
|
||||
filterValue = e.filter.filters[0].value;
|
||||
}
|
||||
|
||||
return {
|
||||
__RequestVerificationToken: kendo.antiForgeryTokens().__RequestVerificationToken,
|
||||
filterValue: filterValue
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
using Microsoft.AspNetCore.Mvc.RazorPages;
|
||||
using Telerik.Examples.RazorPages.Models;
|
||||
|
||||
namespace Telerik.Examples.RazorPages.Pages.ComboBox
|
||||
{
|
||||
public class ComboBoxCrudModel : PageModel
|
||||
{
|
||||
public static List<OrderViewModel> orders;
|
||||
public void OnGet()
|
||||
{
|
||||
if (orders == null)
|
||||
{
|
||||
orders = new List<OrderViewModel>();
|
||||
|
||||
Enumerable.Range(1, 50).ToList().ForEach(i => orders.Add(new OrderViewModel
|
||||
{
|
||||
OrderID = i + 1,
|
||||
Freight = i * 10,
|
||||
ShipName = "ship name " + i,
|
||||
ShipCity = "ship city " + i
|
||||
}));
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
public JsonResult OnGetRead(string filterValue)
|
||||
{
|
||||
if (filterValue != null)
|
||||
{
|
||||
var filteredData = orders.Where(p => p.ShipName.Contains(filterValue));
|
||||
return new JsonResult(filteredData);
|
||||
}
|
||||
return new JsonResult(orders);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
@page
|
||||
@model Telerik.Examples.RazorPages.Pages.ComboBox.ComboBoxVirtualizationModel
|
||||
@{
|
||||
ViewData["Title"] = "ComboBoxIndex";
|
||||
}
|
||||
|
||||
<h1>ComboBoxIndex</h1>
|
||||
|
||||
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
|
||||
@Html.AntiForgeryToken()
|
||||
|
||||
@(Html.Kendo().ComboBox()
|
||||
.Name("orders")
|
||||
.DataTextField("ShipName")
|
||||
.DataValueField("OrderID")
|
||||
.HtmlAttributes(new { style = "width:100%" })
|
||||
.Template("#= OrderID # | For: #= ShipName #")
|
||||
.Height(290)
|
||||
.DataSource(source =>
|
||||
{
|
||||
source.Ajax()
|
||||
.PageSize(80)
|
||||
.Read(r => r.Url("/ComboBox/ComboBoxVirtualization?handler=Read").Data("forgeryToken"));
|
||||
})
|
||||
.Value("55")
|
||||
.Virtual(v => v.ItemHeight(26).ValueMapper("valueMapper"))
|
||||
)
|
||||
|
||||
|
||||
<script>
|
||||
function valueMapper(options) {
|
||||
$.ajax({
|
||||
url: "/ComboBox/ComboBoxVirtualization?handler=ValueMapper",
|
||||
type: "POST",
|
||||
dataType: "json",
|
||||
headers: {
|
||||
RequestVerificationToken: $('input:hidden[name="__RequestVerificationToken"]').val()
|
||||
},
|
||||
data: convertValues(options.value),
|
||||
success: function (data) {
|
||||
options.success(data);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function convertValues(value) {
|
||||
var data = {};
|
||||
|
||||
value = $.isArray(value) ? value : [value];
|
||||
|
||||
for (var idx = 0; idx < value.length; idx++) {
|
||||
data["values[" + idx + "]"] = value[idx];
|
||||
}
|
||||
|
||||
return data;
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function forgeryToken() {
|
||||
return kendo.antiForgeryTokens();
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,59 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using Kendo.Mvc.Extensions;
|
||||
using Kendo.Mvc.UI;
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
using Microsoft.AspNetCore.Mvc.RazorPages;
|
||||
using Telerik.Examples.RazorPages.Models;
|
||||
|
||||
namespace Telerik.Examples.RazorPages.Pages.ComboBox
|
||||
{
|
||||
public class ComboBoxVirtualizationModel : PageModel
|
||||
{
|
||||
public static IList<OrderViewModel> orders;
|
||||
|
||||
public void OnGet()
|
||||
{
|
||||
if (orders == null)
|
||||
{
|
||||
orders = new List<OrderViewModel>();
|
||||
|
||||
Enumerable.Range(1, 5000).ToList().ForEach(i => orders.Add(new OrderViewModel
|
||||
{
|
||||
OrderID = i + 1,
|
||||
Freight = i * 10,
|
||||
OrderDate = new DateTime(2016, 9, 15).AddDays(i % 7),
|
||||
ShipName = "ShipName " + i,
|
||||
ShipCity = "ShipCity " + i
|
||||
}));
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
public JsonResult OnPostRead([DataSourceRequest] DataSourceRequest request)
|
||||
{
|
||||
return new JsonResult(orders.ToDataSourceResult(request));
|
||||
}
|
||||
|
||||
public JsonResult OnPostValueMapper(int[] values)
|
||||
{
|
||||
var indices = new List<int>();
|
||||
if (values != null && values.Any())
|
||||
{
|
||||
var index = 0;
|
||||
foreach (var order in orders)
|
||||
{
|
||||
if (values.Contains(order.OrderID))
|
||||
{
|
||||
indices.Add(index);
|
||||
}
|
||||
index += 1;
|
||||
}
|
||||
}
|
||||
|
||||
return new JsonResult(indices);
|
||||
}
|
||||
}
|
||||
}
|
||||
Загрузка…
Ссылка в новой задаче