or
1 answer
146 views
I have a nested grid in a client template. Everything on my pages works great. I would like to refresh the parent grid when the nested gid is updated. The only way I have found to do this is to use the RequestEnd event on the nested grid, so I defined it in the gird's data source:
@(Html.Kendo().Grid<Campaign>()
.Name("grid_#=Id#")
.Columns(columns =>
{
columns.Bound(p => p.Name).Width(200);
columns.Bound(p => p.MailDate1).Width(150).Title("Mail Date");
columns.Bound(p => p.ProjectedQuantityMailed).Width(100).Title("Quantity");
columns.Bound(p => p.ProjectedPercentReturn).Width(50).Title("Percent Return");
columns.Bound(p => p.ProjectedNumberOfGifts).Width(50).Title("Gifts");
columns.Bound(p => p.ProjectedAverageGiftAmount).Width(50).Title("Average Gift");
columns.Bound(p => p.ProjectedGrossIncome).Width(100).Title("Gross Income");
columns.Bound(p => p.ProjectedGrossIncomePerThousand).Width(50).Title("Gross Income/M");
columns.Bound(p => p.ProjectedTotalCost).Width(100).Title("Cost");
columns.Bound(p => p.ProjectedTotalCostPerThousand).Width(100).Title("Cost/M");
columns.Bound(p => p.ProjectedNetIncome).Width(100).Title("Net");
columns.Bound(p => p.ProjectedNetIncomePerThousand).Width(100).Title("Net/M");
columns.Bound(p => p.ProjectedNetIncomePerDonor).Width(100).Title("Net/Donor");
columns.Bound(p => p.ProjectedCostPerDollarRaised).Width(100).Title("Per Dollar Raised").Hidden(true);
columns.Bound(p => p.ProjectedMonthsToRecoupCost).Width(100).Title("Recoup Months").Hidden(true);
columns.Bound(p => p.ProjectedMailshopCost).Width(100).Title("Mail Shop").Hidden(true);
columns.Bound(p => p.ProjectedPostageCost).Width(100).Title("Postage").Hidden(true);
columns.Bound(p => p.ProjectedCopyCost).Width(100).Title("Copy").Hidden(true);
columns.Bound(p => p.ProjectedProofreaderCost).Width(100).Title("Proof Reader").Hidden(true);
columns.Bound(p => p.ProjectedArtCost).Width(100).Title("Art").Hidden(true);
columns.Bound(p => p.ProjectedListCost).Width(100).Title("List").Hidden(true);
columns.Bound(p => p.ProjectedProductionManagementFee).Width(100).Title("Management").Hidden(true);
columns.Bound(p => p.ProjectedMergePurgeCost).Width(100).Title("Merge Purge").Hidden(true);
columns.Bound(p => p.ProjectedPrintingCost).Width(100).Title("Printing").Hidden(true);
columns.Bound(p => p.ProjectedQctCost).Width(100).Title("QCT").Hidden(true);
})
.ToolBar(toolbar =>
{
toolbar.Custom().Text("CAMPAIGNS").HtmlAttributes(new { id = "btnCampaignLabel" });
toolbar.Create();
toolbar.Save();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Navigatable()
//.ClientDetailTemplateId("panelTemplate")
.ColumnMenu(menu =>
{
menu.ComponentType("modern");
menu.Columns(columns =>
{
columns
.Sort("asc")
.Groups(groups =>
{
groups.Add().Title("Summary Costs").Columns(new List<string> { "ProjectedTotalCost" }); ;
groups.Add().Title("Detailed Costs")
.Columns(new List<string> { "ProjectedMailshopCost", "ProjectedPostageCost","ProjectedCopyCost","ProjectedProofreaderCost"
,"ProjectedArtCost","ProjectedListCost","ProjectedProductionManagementFee","ProjectedMergePurgeCost","ProjectedPrintingCost"
,"ProjectedQctCost"});
});
});
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Model(model =>
{
model.Id(p => p.Id);
model.Field(p => p.Id).Editable(false);
model.Field(p => p.FiscalYearId).Editable(false);
model.Field(p => p.ProjectedNumberOfGifts).Editable(false);
model.Field(p => p.ProjectedGrossIncomePerThousand).Editable(false);
model.Field(p => p.ProjectedNetIncomePerThousand).Editable(false);
model.Field(p => p.ProjectedNetIncome).Editable(false);
model.Field(p => p.ProjectedGrossIncome).Editable(false);
model.Field(p => p.ProjectedTotalCostPerThousand).Editable(false);
model.Field(p => p.ProjectedCostPerDollarRaised).Editable(false);
model.Field(p => p.ProjectedNetIncomePerDonor).Editable(false);
})
.Read(read => read.Action("ByProgram", "Campaign", new { programId = "#=Id#" }))
.Create(update => update.Action("CreateFromNestedGrid", "Campaign", new { programId = "#=Id#" }))
.Update(update => update.Action("Update", "Campaign"))
.Destroy(update => update.Action("Delete", "Campaign"))
.Events(events => events.RequestEnd("onCampaignRequestEnd"))
)
.Pageable()
.Sortable()
.ToClientTemplate()
)
</script>
I have a function defined to handle the event:
<script type="text/javascript">
function onCampaignRequestEnd(e) {
console.log('Campaign grid on request end");
var programGrid = $("#programGrid").data("kendoGrid");
programGrid.dataSource.read();
}
</script>
No matter where I put this script on the page, I receive this error when expanding the parent grid. I even tried adding it the parent grid and received the same error. I have similar scripts defined in outer pages and have never see this happen:
3383:1 Uncaught ReferenceError: onCampaignRequestEnd is not defined
at eval (eval at <anonymous> (jquery.min.js:2:2668), <anonymous>:1:14151)
at Object.syncReady (kendo.aspnetmvc.js:983:21)
at eval (eval at <anonymous> (jquery.min.js:2:2668), <anonymous>:1:7)
at eval (<anonymous>)
at jquery.min.js:2:2668
at Function.globalEval (jquery.min.js:2:2679)
at Ha (jquery.min.js:3:21263)
at n.fn.init.after (jquery.min.js:3:23226)
at n.fn.<computed> [as insertAfter] (jquery.min.js:3:24511)
at init._toggleDetails (kendo.all.js:312399:21)
Aleksandar
Telerik team
answered
on
07 Jun 2023
1 answer
178 views
Hi,
I upgraded Telerik version in our project (Telerik.UI.for.AspNet.Core nuget) from version 2021.2.616 to version 2023.1.425 and since then is for TabStrip component not working LoadContentFrom.
I have in my controller method like this:
public IActionResult GetProductListPartial()
{
return PartialView("_ProductList");
}And in my View I have code like this:
@(Html.Kendo().TabStrip()
.Name("tabstrip")
.Items(tabstrip =>
{
tabstrip.Add()
.Text(@Localizer["Menu.ProductList"])
.Selected(true)
.LoadContentFrom("GetProductListPartial", "ProductList")
.ContentHtmlAttributes(new { @class = "product-list-tab" });
}))When I reworked implementation in the View, then it started to work again:
@(Html.Kendo().TabStrip()
.Name("tabstrip")
.Items(tabstrip =>
{
tabstrip.Add().Text(@Localizer["Menu.ProductList"])
.Selected(true)
//.LoadContentFrom("GetProductListPartial", "ProductList")
.Content(@<text>@await Html.PartialAsync("_ProductList")</text>)
.ContentHtmlAttributes(new { @class = "product-list-tab" });
}))
Alexander
Telerik team
answered
on
31 May 2023
1 answer
163 views
I have Visual Studio 2022 installed and want to use datepicker. Where is the datepicker.dll locate so I can reference it?
Alexander
Telerik team
answered
on
30 May 2023
1 answer
582 views
I'm wondering if there is any support for styling a Dialog in the .net core version of telerik that I am trialling right now? The documentation lists the ability to add a cssclass but that is only for the button, not for the entire dialog itself, I need to replicate previous functionality we were using where a cssclass is applied to the object in javascript when the dialog has been open for a certain amount of time.
This was the only documentation I could find and it's only able to add a class to the button, not the entire dialog.
Configuration, methods and events of Kendo UI Dialog - Kendo UI for jQuery (telerik.com)
1 answer
473 views
I have a grid defined as such:
@(Html.Kendo().Grid<AuditViewModel>()
.Name("AuditLogGrid")
.Columns(columns =>
{
columns.Bound(c => c.Id).Hidden(true);
columns.Bound(c => c.UserId).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
columns.Bound(c => c.TableName).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
columns.Bound(c => c.AuditType).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
columns.Bound(c => c.KeyValuesValue).Encoded(false).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
columns.Bound(c => c.OldValuesValue).Encoded(false).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
columns.Bound(c => c.NewValuesValue).Encoded(false).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
columns.Bound(c => c.ChangedColumnsValue).HtmlAttributes(new { @class = "k-text-right", style = "vertical-align: text-top" });
})
.Pageable(pager => pager.Refresh(true))
.Sortable()
.Filterable()
.NoRecords()
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.PageSize(10)
.ServerOperation(true)
.Events(events => events.Error("error_handler"))
.Model(model =>
{
model.Id(p => p.Id);
model.Field(p => p.UserId);
model.Field(p => p.TableName);
model.Field(p => p.AuditType);
model.Field(p => p.KeyValuesValue);
model.Field(p => p.OldValuesValue);
model.Field(p => p.NewValuesValue);
model.Field(p => p.ChangedColumnsValue);
})
.Read(read => read.Action("GetAuditLogs", "Audit").Data("forgeryToken"))
))And in my "GetAuditLogs" controller methods, I pass in the "request.Page" and "request.PageSize" to calculate Skip and Take. The EF query call DOES return records (default is set to 10 records) however when returning from the Controller, the Grid displays "No Records"
My controller method is as follows:
[HttpPost]
[ValidateAntiForgeryToken]
public async Task<IActionResult> GetAuditLogsAsync([DataSourceRequest] DataSourceRequest request)
{
_logger.LogDebug("GetAuditLogsAsync()");
try
{
var logs = await _auditService.GetAsync(null, q => q.OrderByDescending(x => x.DateTime),
string.Empty, request.Page, request.PageSize);
var total = await _auditService.CountAsync(null, string.Empty);
var models = logs.Select(x => new AuditViewModel
{
Id = x.Id,
UserId = x.UserId,
DateTime = x.DateTime,
TableName = x.TableName,
AuditType = x.Type,
KeyValues = string.IsNullOrWhiteSpace(x.PrimaryKey) ? new Dictionary<string, object>() :
JsonSerializer.Deserialize<Dictionary<string, object>>(x.PrimaryKey),
OldValues = string.IsNullOrWhiteSpace(x.OldValues) ? new Dictionary<string, object>() :
JsonSerializer.Deserialize<Dictionary<string, object>>(x.OldValues),
NewValues = string.IsNullOrWhiteSpace(x.NewValues) ? new Dictionary<string, object>() :
JsonSerializer.Deserialize<Dictionary<string, object>>(x.NewValues),
ChangedColumns = string.IsNullOrWhiteSpace(x.AffectedColumns) ? new List<string>() :
JsonSerializer.Deserialize<List<string>>(x.AffectedColumns)
});
var result = await models.ToDataSourceResultAsync(request);
result.Total = total;
return Json(result);
}
catch (Exception ex)
{
_logger.LogError($"GetAuditLogsAsync() | error [{ex}]", ex);
throw;
}
}And the Audit Service "GetAsync" looks like:
public async Task<IEnumerable<Data.Entities.Audit>> GetAsync(
Expression<Func<Data.Entities.Audit, bool>>? filter = null,
Func<IQueryable<Data.Entities.Audit>, IOrderedQueryable<Data.Entities.Audit>>? orderBy = null,
string includeProperties = "",
int page = 0,
int pageSize = 0)
{
IQueryable<Data.Entities.Audit> query = _dbSet;
if (filter != null)
{
query = query.Where(filter);
}
if (!string.IsNullOrWhiteSpace(includeProperties))
{
query = includeProperties.Split(new[] { ',' }, StringSplitOptions.RemoveEmptyEntries)
.Aggregate(query, (current, includeProperty) => current.Include(includeProperty));
}
var result = orderBy != null
? orderBy(query)
: query;
if (page > 0 && pageSize > 0)
{
result = result.Skip((page - 1) * pageSize).Take(pageSize);
}
return await result.ToListAsync();
}I have verified that the returned results ARE correct (based on Id's), but the Grid displays "No Records". I'd rather not return the ENTIRE dataset to the grid as it is quite large (and the models can be large - this is for auditing so it contains EVERYTHING that was modified). Is there something I'm missing?
1 answer
214 views
I have a grid defined as thus:
@(Html.Kendo().Grid<SubServiceViewModel>()
.Name("SubServiceGrid")
.Columns(columns =>
{
columns.Bound(c => c.Id).Hidden(true);
columns.Bound(c => c.Service)
.ClientTemplate("#=Service.Value#")
.Filterable(false)
.Sortable(false);
columns.Bound(c => c.Value);
columns.Bound(c => c.Active).Hidden(true);
columns.Bound(c => c.Deleted).Hidden(true);
columns.Command(c => c.Destroy());
})
.ToolBar(toolbar =>
{
toolbar.Create();
toolbar.Save();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Pageable(pager => pager.Refresh(true))
.Sortable()
.Filterable()
.NoRecords()
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.PageSize(10)
.ServerOperation(true)
.Events(events => events.Error("error_handler").RequestEnd("onRequestEnd('staticNotifications')"))
.Model(model =>
{
model.Id(p => p.Id);
model.Field(p => p.Service).DefaultValue(ViewData["defaultService"] as ServiceViewModel);
model.Field(p => p.Value);
model.Field(p => p.Active).DefaultValue(EntityLiterals.Yes);
model.Field(p => p.Deleted).DefaultValue(EntityLiterals.No);
})
.Read(read => read.Action("GetSubServices", "SubService").Data("forgeryToken"))
.Create(create => create.Action("CreateSubServices", "SubService").Data("forgeryToken"))
.Update(update => update.Action("UpdateSubServices", "SubService").Data("forgeryToken"))
.Destroy(destroy => destroy.Action("DeleteSubServices", "SubService").Data("forgeryToken"))
))And if I remove the
.Filterable(true)
I get a JS error when I click the column filter button
Uncaught TypeError: Cannot convert undefined or null to object
at Function.keys (<anonymous>)
at C (kendo.all.js:318535:21)
at init._createForm (kendo.all.js:318535:21)
at init._init (kendo.all.js:318535:21)
at init._click (kendo.all.js:318535:21)
at HTMLAnchorElement.dispatch (jquery.min.js?v=oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl-cbzUq8:2:43184)
at y.handle (jquery.min.js?v=oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl-cbzUq8:2:41168)
C @ kendo.all.js:318535
_createForm @ kendo.all.js:318535
_init @ kendo.all.js:318535
_click @ kendo.all.js:318535
dispatch @ jquery.min.js?v=oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl-cbzUq8:2
y.handle @ jquery.min.js?v=oP6HI9z1XaZNBrJURtCoUT5SUnxFr8s3BzRl-cbzUq8:21 answer
79 views
I'm using Trial for testing. But when the number of items is selected more, the text box displaying the item grows larger, breaking the interface of the page. I just want to show the number of selected items (Checked) to replace checked items, is it possible to process? Please guide how. Displays fine both when the event is selected and the initial default load of items is checked.
Example:
Mihaela
Telerik team
answered
on
24 May 2023
1 answer
435 views
I would like to create the following type of chart:
I have set the BaseUnit to weeks but the label prints as 10/31, 11/7, 11/14 etc
@(Html.Kendo().Chart<FlightLog.Models.Charts.HoursByWeek>()
.Name("chart")
.Theme("bootstrap")
.Title("Monthly Hours")
.Legend(legend => legend
.Position(ChartLegendPosition.Bottom)
)
.DataSource(ds => ds
.Read(r => r.Url(Url.Page("./DashBoard", "HoursPerWeek")).Type(HttpVerbs.Post))
)
.Series(series =>
{
series.Column(model => model.Hours).CategoryField("Date");
})
.CategoryAxis(axis => axis.Date()
.Labels(labels => labels.Rotation(-45))
.Labels(labels => labels.DateFormats(dateFormat => dateFormat.Months("MMM")))
.BaseUnit(ChartAxisBaseUnit.Weeks)
.MajorGridLines(lines => lines.Visible(false))
)
.ValueAxis(axis => axis
.Numeric()
.Line(line => line.Visible(false))
.MajorGridLines(lines => lines.Visible(true))
)
)
Mihaela
Telerik team
answered
on
24 May 2023
1 answer
202 views
Hi,
I have a use case where a user can click on a link or button in a parent record in a Kendo Grid, which causes a Kendo Window to become visible and display within it another Kendo Grid listing the child records corresponding to the record clicked in the parent page. In this case, the parent Grid would display a list of Document records; When the user clicks on a link or button in the row of a particular Document, a Window pops up with the Version History records for the Document in another Grid.
Should the Version History Grid be in a partial view, as suggested in https://stackoverflow.com/questions/28772589/load-kendo-grid-in-kendo-window, and then brought into the Window, which is constructed in JavaScript, or is there a better/more standard approach, preferably one that uses html helpers?
Also, how do I set it up so that the Grid in the Window only displays Version History pertaining to the Document that was clicked?
If anybody has links to examples/samples that I can research, or can answer my questions, I'd be most appreciative. I think that similar use cases just use the Grid Hierarchy, but unfortunately it's not an option for my use case.
Thanks!
Taylor
1 answer
288 views
I have a request to add SharePoint document management to an existing ASP .NET Core web application and since the project already has Telerik UI in it I'd like to use the File Manager component. I can't find any samples or guidance on how I would attempt to achieve this. Is it even possible?
Alexander
Telerik team
answered
on
23 May 2023
