I'm trying to use the Kendo Grid in ASP.NET Core MVC application to do multi-select function, first column of the grid being a checkbox column.
My grid has 50 records spread across 5 pages. I have 2 items selected in the first page, 1 item selected in the 2nd page. I use DataBound event to pre-select rows from database. I save the data with a button click (outside the grid) using grid.selectedKeyNames() and post the data to database using a custom Ajax method.
I get all 3 selected ID's in grid.selectedKeyNames() as long as I navigate to second page after the initial load of the grid. If I don't go to the 2nd page of the grid and try to get selectedKeyNames, it returns only selected items from the first page. I always have to go to all the pages where items are pre-selected once to get the grid working.
Have anyone experienced this error before. Appreciate any quick workaround/solution to this problem.
Kendo UI version: v2019.2.619
//Here is my Razor syntax.
@(Html.Kendo().Grid<Web.Models.IndustryModel>
()
.Name("IndustryGrid")
.Columns(columns =>
{
columns.Bound(p => p.Checked).Width(20).ClientTemplate("<input type='checkbox' #=Checked ? checked='checked' :'' # class='chkbx' />").Hidden();
columns.Select().Width(50);
columns.Bound(p => p.IndustryId).Hidden();
columns.Bound(p => p.IndustryName).Width(100);
})
.AutoBind(false)
.Pageable()
.PersistSelection()
.Sortable()
.Events(ev => ev
.Change("onChange")
.DataBound("onDataBound"))
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(p => p.IndustryId))
.Read(read => read.Action("GetIndustryList", "xxxxxxxxxxxxx").Data("SearchData"))
)
.NoRecords(x => x.Template("<div class='empty-grid'></div>"))
)
//Trying to get the selected key names on a button click
$('#btnSave').on('click', function () {
var grid = $('#IndustryGrid').data('kendoGrid');
alert(grid.selectedKeyNames());
});
// Function to pre-load selected rows from database
function onDataBound(arg) {
var grid2 = this;
var rows = grid2.items();
$(rows).each(function (e) {
var row = this;
var dataItem = grid2.dataItem(row);
if (dataItem.Checked)
grid2.select(row);
});
}

I have a model with a property of IQueryable<T> that I want to bind to a grid. This achievable with the Html helper but to me it looks messy. I was trying to achieve the same with the tag helper. In the html helper it is @(Html.Kendo().Grid(Model.GridData) ... I do not see a property that I can connect the Model.GridData in <kendo-grid ...
Does anybody have a suggestion?
When I try to do the following, the UI Filters are not reset, but the appropriate data is displayed.
var grid = $("#grid").data("kendoGrid");
grid.dataSource.filter({});
I have tried this also:
grid.dataSource.filter();
Although not ideal, this works and the UI filters are reset:
$(".k-i-filter-clear").click();
Current Month August:
@(Html.Kendo().DateRangePicker()
.Name("daterangepicker3")
.Format("MM/dd/yyyy")
.Range(r => r.Start(DateTime.Now.AddMonths(-1)).End(DateTime.Now.AddMonths(-1).AddDays(10)))
.HtmlAttributes(new { style = "width: 100%", title = "daterangepicker3" })
)
When the default Range is last month, clicking the date boxes, shows August, not July where the highlighted range is. Is there away to set the start month?
I am use DatePicker with format 'MM.yyyy' in asp net mvc.
Validation for mvc not use attribute data-format, and validate failed.
Exemple https://dojo.telerik.com/eZUTEbIP
In sources kendo.validation.js use: return kendo.parseDate(input.val(), input.attr(kendo.attr('format'))) !== null;
In sources kendo.aspnetmvc.js use: return input.val() === '' || kendo.parseDate(input.val()) !== null;
if change to same: return input.val() === '' || kendo.parseDate(input.val(), input.attr(kendo.attr('format'))) !== null; then validate success.
Please fix it in next release.
I am using the following in a HTML form, where Model.SecheduledActions is a List<ScheduledAction> that contains a member that is a DateTime.
01.@(Html.Kendo().Grid(Model.ScheduledActions)02. .Name("ScheduledItems")03. .Columns(c =>04. {05. c.Bound(p => p.Id).Hidden().ClientTemplate("#= Id #" +06. "<input type='hidden' name='ScheduledActions[#= index(data)#].Id' value='#= Id #' />"07. );;08. c.Bound(p => p.Cylinders).ClientTemplate("#= Cylinders #" +09. "<input type='hidden' name='ScheduledActions[#= index(data)#].Cylinders' value='#= Cylinders #' />"10. );11. c.Bound(p => p.ScheduledDate).ClientTemplate("#= ScheduledDate #" + 12. "<input type='hidden' name='ScheduledActions[#= index(data)#].ScheduledDate' value='#= ScheduledDate #' />"13. );14. })15. 16. .DataSource(dataSource => dataSource.Ajax()17. .Model(model => 18. {19. model.Id(p => p.Id);20. model.Field(p => p.Id).Editable(false);21. })22. .ServerOperation(false)23. ))However when this data is submitted, the datetime is DateTime.Min, and I have no way of editing the datetime in the grid to begin with.
How might I go about 1) being able to select a date for the ScheduledDate member, and 2) Specify the type of editor for that column?
I am setting up a scheduler which will always be in Month view, and want to only pull data from my database for the displayed month, reading from the database when a new month is selected. I am anticipating sending my controller the selected date in my datasource.Read call, and when the arrows at the top are clicked to select a new month, another read is performed.
How would I go about doing this?

I have a bar chart, which uses a tooltip template, to show a pop-up pie chart.
This works, however if the mouse cursor is dragged from outside of the chart, the tooltip pops up an empty window. Only if the mouse is then dragged from within the chart, does the pop-up chart show correctly.
I've attached images showing what happens.
The code is:-
@(Html.Kendo().Chart<WLI_Payments.Models.SummaryChartItem>() .Name("SummaryChartMedic") //.Title("Paid / Awaiting Payment Requests") .Title(ti => ti.Text("Summary by Practitioner - Number of Sessions").Font("11px Arial")) .Theme("bootstrap") .Legend(l => l.Visible(false)) .ChartArea(c => c.Background("transparent").Height(250)) .DataSource(ds => ds.Read(read => read.Action("GetDateRangeMedicSummary", "Dashboard").Data("chartFilterMonthly"))) .Series(series => { series.Column(model => model.YIntValue).Name("Point of Delivery").Spacing(0).Labels(l => l.Visible(true).Font("9px Arial")); }) .CategoryAxis(axis => axis .Categories(model => model.XValue) .Labels(labels => labels.Rotation(-45).Font("10px Arial")) .MajorGridLines(lines => lines.Visible(false)) ) .ValueAxis(axis => axis.Numeric() .Labels(labels => labels.Font("10px Arial")) ) .Tooltip(tooltip => tooltip .Visible(true) .Background("White") .Template("#=tooltipTemplate(dataItem)#") ) .Pannable(p => p.Lock(ChartAxisLock.Y)) .Zoomable(zoomable => zoomable .Mousewheel(mousewheel => mousewheel.Lock(ChartAxisLock.Y)) .Selection(selection => selection.Lock(ChartAxisLock.Y)) ) )The template is:-
<script id="childChartTemplate" type="text/x-kendo-template"> <div id="childChart" /> # setTimeout(function() { createChildChart(AdditionalID,startDate,endDate,XValue,ExtraText); }) # </script> var tooltipTemplate = kendo.template($("#childChartTemplate").html());The code is:-
function createChildChart(medicID, s, e, PractName, et) { var childDataSource = new kendo.data.DataSource({ transport: { read: { url: "@Url.Content("~/Dashboard/GetDateRangeMedicSessionSummary/Get")", dataType: "json", data: { MedicID: medicID, start: s, end: e, DirectorateID: selectedDirectorate } } } }); $("#childChart").kendoChart({ dataSource: childDataSource, title: { text: PractName + '(' + et + ')', font: "11px Arial" }, theme: "bootstrap", legend: { visible: true, orientation: "horizontal", position: "bottom" }, seriesDefaults: { type: "pie", labels: { visible: true, format: "{0}" } }, series: [{ field: "YIntValue", categoryField: "XValue", name: "Session Type", labels: { visible: true, distance: 15 } }] }); }I'm not sure if it always had this bug, or if upgrading to version 2019.2.619 from a much earlier version introduced it.
Version: 2019.2.619
I am noticing that with Inline mode I can specify a per column Editable for the visible columns in the DataSource section, ie:
.DataSource(dataSource => dataSource
.Ajax()
.Model(model =>
{
model.Id(p => p.ITEM_LISTID);
// When Edit Mode is Inline this is applied.
model.Field(p => p.ITEM_LISTID).Editable(false);
}
)
However, when in Popup mode, I have to specify [ScaffoldColumn(false)] on the Model properties that shouldn't be editable. However, ScaffoldColumn(false) columns can no longer be used as Grid columns.
It would be nice if Popup mode only used the columns defined in the Columns markup and followed the Ediable similar to the Inline mode.
Am I missing something?
Peter
I noticed this enhancement: https://feedback.telerik.com/kendo-jquery-ui/1357813-built-in-pdf-viewer-control-for-both-kendo-ui-and-kendo-ui-mobile from https://feedback.telerik.com/aspnet-mvc/1357610-add-mvc-pdf-viewer.
The first link mentions printing, but second does not.
Will printing be made available? Otherwise is it possible to add custom actions/buttons to the toolbar of the PDF Viewer?
