Questions on UI for ASP.NET Core Forum

4 answers

346 views

Hi,

I created a project and i need to put a treelist view to handle parents and child elements of a grid. I created a father and a child, but the page doesn't load any record in my grid. Am i missing something?

The attached files are the grid viewed in my page and the model received from the datasource

Here is the model

public class ProjectTaskViewModel

{

public string IdTask { get; set; }

public string FatherId { get; set; }

public string TaskTitle { get; set; }

}

The View:

@(Html.Kendo().TreeList<Models.ProjectTaskViewModel>()

.Name("treelist")

.Columns(columns =>

{

columns.Add().Field(p => p.IdTask).Title(" ").Filterable(false).Sortable(false).Width("105px").Template("#=customformatter(Id)#");

columns.Add().Field(p => p.TaskTitle).Title("Nsme");

})

.Pageable(p => p.Refresh(true).PageSize(20).PageSizes(new int[] { 20, 50, 100 }))

.Sortable()

.Filterable()

.DataSource(dataSource => dataSource

.Read(read => read.Action("TreeViewDataSource", "ProjectTask").Data("CustomData")) //Function that contains correctly the IdProject param

.ServerOperation(false)

.Model(m => {

m.Id<string>(p => p.IdTask);

m.ParentId<string>(p => p.FatherId);

m.Field(p => p.TaskTitle);

m.Field<string>(p => p.FatherId);

})

)

And finally the TreeViewDataSource:

public JsonResult TreeViewDataSource([DataSourceRequest]DataSourceRequest request, string IdProject)

{

var temp = _db.ProjectTasks.Where(o => o.IdProject == IdProject).Select(o => new ProjectTaskViewModel

{

FatherId = o.ParentId,

IdTask = o.Id,

TaskTitle = o.Title

});

var result = temp.ToTreeDataSourceResult(request, o => o.IdTask, o => o.FatherId, o => o);

return Json(result);

}

TreeList

answered on 23 Apr 2020

5 answers

878 views

Add/Edit records in a popup window

Hello,
I just start to use Telerik UI for core in razor pages project
I have a grid holding some records. I would like to create a custom popup for new and edit records.
The functionality for the add and edit records exist in a view component.
The booking issues for me are
How to use the view component with a popup window.
After successful saving, how to close the popup window to set the focus to the grid.
Appreciate your help, preferable with sample code.

Grid

answered on 22 Apr 2020

1 answer

2.5K+ views

Where is icon list for IconClass

I found several icons list, but I would like to know which list works with commands.

columns.Command(command => command.Custom("DetailsCommand").IconClass("filter").Click("showDetails"));

Grid

answered on 22 Apr 2020

1 answer

335 views

Error after applyed filter on column

I'm wrote this action

[Authorize]

public IActionResult Item_ReadData([DataSourceRequest] DataSourceRequest request, string dateFiler)

{

CultureInfo culture = CultureInfo.CreateSpecificCulture("en-US");

var selectedDate = DateTime.Parse(dateFiler, culture);

System.Security.Claims.ClaimsPrincipal currentUser = this.User;

var scope = currentUser.Claims.ToList().SingleOrDefault(c => c.Type == "Scope")?.Value;

using (DbNavision ctx = new DbNavision())

{

var itemsFound = (from rec in ctx.UpSrlItem

select new ItemModel(rec, selectedDate, scope));

var dataResult = itemsFound.ToDataSourceResult(request);

return Json(dataResult);

}

It works ok! But if I apply a filter on a column (attach what I'm doing), it shows me this error.

System.InvalidOperationException: 'The LINQ expression 'DbSet<UpSrlItem>

.Where(u => new ItemModel(

u,

__selectedDate_0,

__scope_1

).No.ToLower() == "fratverde")' could not be translated. Either rewrite the query in a form that can be translated, or switch to client evaluation explicitly by inserting a call to either AsEnumerable(), AsAsyncEnumerable(), ToList(), or ToListAsync().

Model output is a custom, because I need to update additional properties of model that aggregate several information.

I can't use ToList() or other, because result contains a lot of rows. Infact I added .Scrollable(scrollable => scrollable.Virtual(true)) property on Grid.

This is my model costructor

01.public ItemModel(UpSrlItem item, Nullable<DateTime> dateFilter, string locationFilter)

02. {

03. No = item.No;

04. Description = item.Description;

05. Brand = item.Brand;

06.

07. using (DbNavision ctx = new DbNavision())

08. {

09. //Net Change

10. List<UpSrlItemLedgerEntry> netChange;

11.

12. if (locationFilter != "")

13. netChange = (from rec in ctx.UpSrlItemLedgerEntry

14. where rec.ItemNo == No &&

15. rec.LocationCode == locationFilter &&

16. rec.PostingDate <= dateFilter

17. select rec).ToList();

18. else

19. netChange = (from rec in ctx.UpSrlItemLedgerEntry

20. where rec.ItemNo == No &&

21. rec.PostingDate <= dateFilter

22. select rec).ToList();

23.

24. NetChange = netChange.Sum(ile => ile.Quantity);

25.

26. //Purchases (Qty.) + Positive Adjmt. (Qty.)

27. List<UpSrlItemLedgerEntry> purchasesQty;

28.

29. if (locationFilter != "")

30. purchasesQty = (from rec in ctx.UpSrlItemLedgerEntry

31. where rec.ItemNo == No &&

32. rec.LocationCode == locationFilter &&

33. rec.PostingDate <= dateFilter &&

34. (rec.EntryType == (int)UpSrlItemLedgerEntryEntryTypes.Purchase ||

35. rec.EntryType == (int)UpSrlItemLedgerEntryEntryTypes.Positive_Adjmt)

36. select rec).ToList();

37. else

38. purchasesQty = (from rec in ctx.UpSrlItemLedgerEntry

39. where rec.ItemNo == No &&

40. rec.PostingDate <= dateFilter &&

41. (rec.EntryType == (int)UpSrlItemLedgerEntryEntryTypes.Purchase ||

42. rec.EntryType == (int)UpSrlItemLedgerEntryEntryTypes.Positive_Adjmt)

43. select rec).ToList();

44.

45. PurchasesQty = purchasesQty.Sum(ile => ile.Quantity);

46.

47. UpSrlItemLedgerEntry lastEntry;

48. if (locationFilter != "")

49. lastEntry = (from rec in ctx.UpSrlItemLedgerEntry

50. where rec.ItemNo == No &&

51. rec.LocationCode == locationFilter &&

52. rec.PostingDate <= dateFilter

53. select rec).ToList().LastOrDefault();

54. else

55. lastEntry = (from rec in ctx.UpSrlItemLedgerEntry

56. where rec.ItemNo == No &&

57. rec.PostingDate <= dateFilter

58. select rec).ToList().LastOrDefault();

59.

60. LastEntryDate = lastEntry?.PostingDate;

61.

62. }

63. }

Grid

answered on 21 Apr 2020

1 answer

336 views

TimePicker Grid Column Filter

My Grid Column Filter for a Time value is not working by this definition:

Model

public partial class Session : PropertyBase

{

[Display(Name = "Id")]

public int Id { get; set; }

[Display(Name = "Device Id")]

public System.Int32? DeviceId { get; set; }

[Display(Name = "Group Id")]

public System.Int32? GroupId { get; set; }

[MaxLength(50)]

public System.String UniqueId { get; set; } = $"{Guid.NewGuid()}";

/// <summary>

/// Track when the session took place

/// </summary>

public System.DateTime? Timestamp { get; set; }

[NotMapped]

[DataType(DataType.Date)]

public System.DateTime? Date => Timestamp;

[NotMapped]

[DataType(DataType.Time)]

public System.DateTime? Time => Timestamp;

Grid

@(Html.Kendo().Grid<Session>()

.Name("grid")

.Columns(columns =>

{

columns.Command(command => command

.Custom("Detail")

.Click("goDetail"))

.Width(Glossary.Portal.ButtonWidth);

columns.Bound(p => p.Date).Title("Date").Format("{0:MM/dd/yyyy}")

.Filterable(ftb => ftb.Cell(cell => cell.Operator("gte")

.ShowOperators(false)));

columns.Bound(p => p.Time).Title("Time")

.Format("{0:hh:dd:mm tt}")

.Filterable(x => x.UI(GridFilterUIRole.TimePicker));

})

.Pageable()

.Sortable()

.Scrollable()

.Filterable(ftb => ftb.Mode(GridFilterMode.Row))

.HtmlAttributes(new { style = "height:550px;" })

.Selectable()

.Navigatable()

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.Read(read => read.Action("IndexJson", "Sessions")

.Data("gridGetData"))))

Grid

answered on 21 Apr 2020

1 answer

12.1K+ views

Nuget package Telerik.UI.for.AspNet.Core.Trial not found

Hello support,

I want to use the Asp.Net Core extensions but I can't install the package Telerik.UI.for.AspNet.Core.Trial because it isn't found.

I followed the instructions at this link https://www.telerik.com/download-trial-file/v2/aspnet-core-ui but when I go to the option "Manage Nuget packages for solution" these are the packages available to download (see the attached file).

What can I do to install the package Telerik.UI.for.AspNet.Core.Trial?

Thank you.

Installer and VS Extensions

answered on 21 Apr 2020

1 answer

146 views

Cannot pass Data to Read datasource Method

I would pass DatePicker value to datasource of grid, using Data method in this way

<div class="d-inline">

<label>Data</label>

@(Html.Kendo().DatePicker()

.Name("dateFilterDatepicker") // The name of the DatePicker is mandatory. It specifies the "id" attribute of the widget.

.Min(new DateTime(1900, 1, 1)) // Sets the min date of the DatePicker.

.Max(new DateTime(2099, 12, 31)) // Sets the max date of the DatePicker.

.Value(DateTime.Today) // Sets the value of the DatePicker.

)

@(Html.Kendo().Button()

.Name("textSearchButton")

.HtmlAttributes( new {type = "submit"} )

.Content("Ricerca")

.Events(e=>e.Click("onClick")))

</div>

<div class="text-center form-group">

@(Html.Kendo().Grid<ItemModel>()

.Name("itemGrid")

.ToolBar(t => t.Search())

.Filterable()

.AutoBind(true)

.Columns(columns =>

{

columns.Bound(f => f.No);

columns.Bound(f => f.Description);

columns.Bound(f => f.Brand);

columns.Bound(f => f.NetChange);

columns.Bound(f => f.PurchasesQty);

columns.Bound(f => f.LastEntryDate).Format("{0:dd/MM/yyyy}"); ;

})

.Pageable() // Enable paging

.Sortable() // Enable sorting

.Scrollable(scrollable => scrollable.Virtual(true))

.HtmlAttributes(new { style = "height:430px;" })

.DataSource(dataSource => dataSource //Configure the Grid data source.

.Ajax() //Specify that Ajax binding is used.

.PageSize(20)

.Read(read => read.Action("Item_ReadData", "Home").Data("additionalData")) // Set the action method which will return the data in JSON format.

)

</div>

<script>

function additionalData() {

var value = $("#dateFilterDatepicker").data("kendoDatePicker").value();

return { selectedDate: value }; // send the filter value as part of the Read request

}

function onClick() {

var grid = $("#itemGrid").data("kendoGrid");

grid.dataSource.read(); // rebind the Grid's DataSource

}

</script>

But I'm sure that date is valued, but it seems that not fires additionalData function when it request read method of datasource

My action

[Authorize]

public IActionResult Item_ReadData([DataSourceRequest] DataSourceRequest request, DateTime selectedDate)

{

var itemsFound = new List<ItemModel>();

System.Security.Claims.ClaimsPrincipal currentUser = this.User;

var scope = currentUser.Claims.ToList().SingleOrDefault(c => c.Type == "Scope")?.Value;

using (DbNavision ctx = new DbNavision())

{

if (selectedDate != new DateTime(1, 1, 1))

itemsFound = (from rec in ctx.UpSrlItem

select new ItemModel(rec, selectedDate, scope)).ToList();

var dataResult = itemsFound.ToDataSourceResult(request);

return Json(dataResult);

}

The second parameter of action is ever empty, but if I remove it from action definition, is the same.

what's wrong?

Grid

answered on 20 Apr 2020

3 answers

659 views

In Details Template an event in ClientHeaderTemplate is not triggered

In the Details Template of the Master Grid , in the first Tab Item grid , I have added a column id with ClientHeaderTemplate as a Check box .

When clicked on the checkbox the event is not triggered.

<script id="secattributes" type="text/kendo-tmpl">

@(Html.Kendo().TabStrip()
.Name("tabStrip_#=SecurityMasterId#")
.SelectedIndex(0)
.Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
.Items(items =>
{
items.Add().Text("Security Attributes").Content(@<text>

@( Html.Kendo().Grid<CoreMaster.Models.SecurityAttributeView>()
.Name("securityMaster_#=SecurityMasterId#")
.ToolBar(toolbar =>
{
toolbar.Create().Text("Add new Attribute");
})
.Editable(editable =>
{
editable.Mode(GridEditMode.PopUp).TemplateName("secattribute");
})
.Columns(cols =>
{

//This Check box event is not triggered

cols.Bound(y => y.Id).ClientHeaderTemplate("<label><input id='myId' type='checkbox' value='#= getAllData #' onchange='getAllRecords(#=id#)'>Display all records</label>");
cols.Bound(y => y.Name).Title("Name");
})
.DataSource(dataSource => dataSource
.Ajax().ServerOperation(true).PageSize(10)
.Model(model =>
{
model.Id(p => p.Id);
})
)
.Sortable()
.Pageable(p => p.Enabled(true)).Events(e => e.Edit("onEditGrid")) .ToClientTemplate() ) </text>);

Grid

answered on 16 Apr 2020

4 answers

615 views

Create Event Programmatically

I have the scheduler set to timelinemonth view. I would like to create events in the scheduler by simply clicking on the day for a particular attendee. I cant find a way to create the event programmatically without showing the dialog. Unfortunately the "add event" method simply shows the dialog.

I can call the create method in the controller from jquery but then I would have to refresh the page to show the new data.

Scheduler

answered on 16 Apr 2020

5 answers

192 views

Action on Tab Selection

I have a multi-step UI that requires the user select a group from a TreeList. That group selection must then be used to feed into a Grid that is populated by People that are in that selected Group.

How do I do this? I've been using the PanelBar up to this point to perform multi-step processes. However, I've never had to base the data selection in step 2 with the selection from step 1. Can I late bind the Grid so it will go get its data when the host Tab is selected?

PanelBar

answered on 16 Apr 2020