Questions on UI for ASP.NET Core Forum

1 answer

132 views

Grid incorrectly truncates long integral types when parsing

I have a long variable.

Normally, there are no problem displaying this value on the grid.
However, when the value gets very large, it gets truncated.

Original value: 144254210960752435
Truncated value: 144254210960752420

The original value is still within the max range of long, so the truncation shouldn't happen.
https://docs.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/integral-numeric-types

At the moment, the only workaround I can think of, is to create a string variable to store the long value, and have grid display that string variable instead.

Is there a better way to resolve this problem?

Grid

answered on 06 Jan 2021

1 answer

156 views

Kendo Window Error while deploying to IIS

We are using window component (Telerik UI for ASP.Net Core) in our ASP.Net core project and the code is provided below

in View

win.center().open();
win.refresh({
url: "/DocumentProperties/Publish",
data: { documentID: id}
});

Controller function

public ViewResult Publish(Int32 documentID)
{

}

The code is working as expected while testing with visual studio in local machine. The contoller funciton is called and correct parameters are being passed. How ever when we publish the package and deploy to the Dev and QA Server( IIS 10) the conroller function is not getting called. while inspecting via developer toolbar we can see 404 not found. The issue is that an unwanted parameter gets added to the end of the call for example

the resulting call as part of the refresh method is

/DocumentProperties/Publish?documentID=7&_=1609286664558

while the acutal/expected call should be

/DocumentProperties/Publish?documentID=7

This parameter gets appended to all the other instances in the page (other functions) where refresh method is used

/Search/Details?id=7&param2=a&_=1609286664557:1 Failed to load resource: the server responded with a status of 404 (Not Found)

We have tested in both our IIS servers (Dev/QA) and behavior is same. Please provide a fix for the same,

Window

answered on 01 Jan 2021

3 answers

168 views

[Solved] tab navigate muliple inputs in EditorTemplate

Hi

I have a navigable in-cell edit grid with a particulate column using EditorTemplate.

There are 3 inputs in this template, but I cannot tab navigate through this 3 inputs.

When I enter tab key, it will close this cell and jump to next column edit.

I need to be able to tab edit through all columns and also tab through all inputs in this particular column.

Please advice how i can achieve this.

Thanks in advance!

Grid

answered on 30 Dec 2020

3 answers

1.9K+ views

Set datasouce of child grid using datasource of parent grid in Kendo UI

I have this form:

@*Some form fields here that accept startDate and endDate*@

<div>

<button id="searchButton">Search</button>

</div>

<div class="col-md-12 row">

@(Html.Kendo()

.Grid<ProjectName.DataModels.Models.Customer>()

.Name("CustomerGrid")

.Columns(columns =>

{

columns.Bound(e => e.CustomerId);

columns.Bound(e => e.SomeCustomerColumn);

})

.ClientDetailTemplateId("OrderDetails")

.AutoBind(false) // Don't load the data yet because I'll need to supply parameters for the fetch

.DataSource(dataSource => dataSource

.Ajax()

.Events(events=>events.Change("loadChildGrid"))

.PageSize(20)

.Model(model => model.Id("CustomerId", typeof(string)))

.Read(read => read.Action("GetCustomersAsync", "Customer").Data("passArguments"))

)

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

@(Html.Kendo()

.Grid<ProjectName.DataModels.Models.Order>()

.Name("OrderDetails_#=CustomerId#")

.Columns(columns =>

{

columns.Bound(o => o.ProductName);

columns.Bound(o => o.SomeOrderColumn);

})

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(10)

.Model(model=>model.Id("OrderId"))

.ServerOperation(false)

)

.AutoBind(false)

.ToClientTemplate()

)

</script>

</div>

<script type="text/javascript">

$("#searchButton").on("click", function () {

// Load the customerGrid here:

$("#CustomerGrid").data("kendoGrid").dataSource.read();

});

function passArguments() {

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

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

return {

start: startDate,

end: endDate

}

// QUESTION: How to load the child grid: OrderDetails_123 by using datasource from the parent grid?

// THIS IS WHAT I'VE TRIED SO FAR:

function loadChildGrid() {

var parentData = $("#CustomerGrid").data("kendoGrid").dataSource.data();

//Initialize the child grid

$.each(parentData, childDataFeeder);

}

function childDataFeeder(index, item) {

var childGridName = "#" + "OrderDetails_" + item.CustomerId;

var childGrid = childGridName.data("kendoGrid");

childGrid.dataSource.data(value.Orders)

}

</script>

And a method in the Customer controller:

public async Task<ActionResult> GetCustomersAsync([DataSourceRequest] DataSourceRequest request, DateTime start, DateTime end)

{

var customersWithOrders = GetDataForParentAndChildGrid(start, end);

return Json(consolidatedData.ToDataSourceResult(request));

}

private List<Customer> GetDataForParentAndChildGrid(DateTime start, DateTime end)

{

var testData = new List<Customer>();

// Gets required data with those dates filter and perform some mathematical calculations

testData.Add(new Customer

{

CustomerId = "123",

SomeCustomerColumn = "Blah blah",

Orders = new List<Order>()

{

new Order{

OrderId = "123ABC",

CustomerId = "123",

SomeOrderColumn = "Blah Blah Blah"

}

});

return testData;

}

My goal is to set the 'dataSource' of child grid using data that is already available from the main grid. What I've tried so far is that I have attached 'Change' event to the main grid which fires 'loadChildGrid' function where I try to extract the data from main grid and pass every item of it to a 'childDataFeeder' function to initialize the 'dataSource' of child grid. The issue here is that when it tries to do that, the child grid doesn't exist yet (because it's not created by Kendo until a user clicks on the expand icon in the main grid).
You can see what I've tried so far in the 'childDataFeeder' method(without any success). So I'd greatly appreciate your direction on this.
Thank You!

Grid

answered on 28 Dec 2020

4 answers

218 views

Load Content when item changes

I have a controller for which the "Index" view just shows a row of data from a model collection. When the "Details" link is selected at any row, I switch to a "Details" page for the same controller with the following tabs:

General: Showing details for the selected model

Contacts: Showing address and phone data for the same model

etc.

The issue I have is that upon selecting the Contacts tab, I need to get data loaded from my model suitable for that tab and I don't know how to affect it.

I have something like this (gleaned after hours of searching:)

tabstrip.Add().Text("Contact").LoadContentFrom("EditContact", "HouseholdController", new { id = Model.Facility_Id }).Selected("@Model.tab" == "Contact");

but that doesn't do anything when I select the tab. I'm at a loss.

The HouseholdController has the following method:

        public ActionResult EditContact()
        {
            var model = db.GetWithFacility_Id(1);
            return View(model);
        }

I am grateful for any guidance. I'm a total beginner here.

TabStrip

answered on 25 Dec 2020

1 answer

108 views

Insert new tab item bug in 2020R3Sp2

tabStrip.insertAfter({
text: 'xxx',
encoded: false,
id: "xxxxxxxxx",
content: "<iframe style='border-width:0px;height:calc(100vh - 68px);width:100%;overflow:hidden' src='"+url+"'></iframe>",
}, tabStrip.select());

id can not be set.!!!!

TabStrip

answered on 25 Dec 2020

7 answers

460 views

[Solved] Update to ASP.NET Core 3.0 GA

Hello,

Could you update your librairies to ASP.NET Core 3.0 GA (instead of 3.0 RC1) because there are some version conflicts when I want to install some nuget packages. For example, If I install the packages Telerik.UI.for.AspNet.Core 2019.3.917 and Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation 3.0.0 in my project, I've get the error :

Error NU1107 - Version conflict detected for Microsoft.CodeAnalysis.Common.

MyProject -> Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation 3.0.0 -> Microsoft.CodeAnalysis.Razor 3.0.0 -> Microsoft.CodeAnalysis.Common (>= 3.3.0)

MyProject -> Telerik.UI.for.AspNet.Core 2019.3.917 -> Microsoft.CodeAnalysis 3.0.0 -> Microsoft.CodeAnalysis.CSharp.Workspaces 3.0.0 -> Microsoft.CodeAnalysis.Common (= 3.0.0)

General Discussions

answered on 25 Dec 2020

3 answers

773 views

Doubleclick event in aspnet core grid

I have a aspnet core grid that currently has the following code set to select the current row:

.Events( events => events.Change("onRowSelect"))

The function works fine and is written as:

function onRowSelect(e) {

var row = this.dataItem(this.select());

.... do work here

)

The users have added a new requirement that the event must be a doubleclick event and I'm not sure how to proceed. Any help would be appreciated.

Thanks

Grid

answered on 25 Dec 2020

1 answer

337 views

Set datasouce of a child grid from the datasource of parent grid in Kendo UI for .NET core

I have this form:

<div align="center">

<div>

<button type="button" class="searchButton" id="search">Search</button>

</div>

<div class="col-md-12 row">

@(Html.Kendo()

.Grid<ProjectName.DataModels.Models.Customer>()

.Name("CustomerGrid")

.Columns(columns =>

{

columns.Bound(e => e.CustomerId);

columns.Bound(e => e.SomeCustomerColumn);

})

.Sortable()

.Pageable()

.Scrollable()

.Filterable()

.ClientDetailTemplateId("OrderDetails")

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

.AutoBind(false) // Don't load the data yet because I'll need to supply parameters for the fetch

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(20)

.Read(read => read.Action("GetCustomersAsync", "Customer"))

)

.Events(events => events.DataBound("dataBound"))

)

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

@(Html.Kendo()

.Grid<ProjectName.DataModels.Models.Order>()

.Name("OrderDetails_<#= CustomerId #>")

.Columns(columns =>

{

columns.Bound(o => o.ProductName);

columns.Bound(o => o.SomeOrderColumn);

})

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(10)

)

.AutoBind(false)

.Pageable()

.Sortable()

.ToClientTemplate()

)

</script>

</div>

<script type="text/javascript">

function dataBound() {

this.expandRow(this.tbody.find("tr.k-master-row").first());

}

$("#searchButton").on("click", function () {

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

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

// How to load the customerGrid here by sending over the startDate and endDate? They are set from Kendo Date Pickers.

// How to load the child grid: OrderDetails_123 by using the datasource used by the parent grid?

});

</script>

And a method in the 'Customer' controller:

public async Task<ActionResult> GetCustomersAsync([DataSourceRequest] DataSourceRequest request, DateTime start, DateTime end)

{

var consolidatedData = GetDataForParentAndChildGrid(start, end);

return Json(new[] { consolidatedData }.ToDataSourceResult(request));

}

private ConsolidatedDataModel GetDataForParentAndChildGrid(DateTime start, DateTime end)

{

var testData = new List<CustomerData>();

// Gets required data with those dates filter and does a lot of mathematical calculations on them

testData.Add(new CustomerData

{

CustomerId = "123",

SomeCustomerColumn = "Blah blah",

Orders = new List<OrderData>()

{

new OrderData{

OrderId = "123ABC",

CustomerId = "123",

SomeOrderColumn = "Blah Blah Blah"

}

});

var consolidatedData = new ConsolidatedDataModel()

{

Data = testData

};

return consolidatedData;

}

After I click the "Search" button (which will take into account the start and end date fields to fetch the data), I'd like to update the 'dataSource' for the parent grid and the child grid. As you can see, the data I need for the parent grid already has data that I need for the child grid so I cannot do a new action call to populate the child grid. How do I accomplish this?

Please help.

Thank You!

Grid

answered on 24 Dec 2020

1 answer

377 views

Failed to execute command | When trying to convert ASP.NET Core Project to a Telerik Project

I have an ASP.NET Core (.NET 5) project open in Visual Studio 2019 (16.8.3) but when I try to convert it to a Telerik Project, I receive the following error. What's the best way to solve this?

Failed to execute command.

System.NullReferenceException: Object reference not set to an instance of an object.
at Telerik.KendoUI.ASP.NET.Core.VSX.Wizards.ConvertWizard.GetPropertyValue(String propertyName)
at Telerik.VSX.WizardEngine.Controls.WizardControlBase.PopulateCollectedValues(IPropertyDataDictionary gatheredData)
at Telerik.VSX.WizardFramework.Pages.DynamicPageController.GetData()
at Telerik.WizardFramework.Wizard.GetCurrentPageData()
at Telerik.WizardFramework.Wizard.UpdateNavigation()
at Telerik.WizardFramework.Wizard.EnsureInitialized()
at Telerik.VSX.WizardEngine.ScenarioManagement.ScenarioDefinitionExecutor.CreateWizard(IWizardContext wizardControlContext, IDispatcher dispatcher, IWizardUI ui)
at Telerik.VSX.WizardEngine.ScenarioManagement.ScenarioDefinitionExecutor.CollectData(IDispatcher dispatcher)
at Telerik.VSX.WizardEngine.ScenarioManagement.ScenarioDefinitionExecutor.CollectData()
at Telerik.VSX.ProjectManagement.StreamlinedProjectConfiguration.LaunchWizard(ProjectConfigurationType options)
at Telerik.VSX.ProjectManagement.StreamlinedProjectConfiguration.LaunchWizard(ProjectConfigurationType options, PrepareWizardDelegate prepareWizardDelegate, CheckPrerequisitesDelegate checkPrerequisites)
at Telerik.KendoUI.ASP.NET.Core.VSX.ProjectConfigurators.StreamlinedProjectConfiguration.StartConvertWizard()
at Telerik.KendoUI.ASP.NET.Core.VSPackage.CommandExecutor.Execute(UInt32 commandId)
at Telerik.VSX.VSPackage.PackageBase.CommandCallback(Object sender, EventArgs e)

General Discussions

answered on 23 Dec 2020