I have two auto completes working on the main page of this application. One on the header and one that appears when the user resizes the browser down to a smaller screen width/
Both use the same controller ajax action. It seems the first time the user types in the values it take about 5 seconds to render matches. And subsequent searches are instant.
Is there a way to optimize that so that that first search is instant? Please note that the dataset is large. Over 10,000 products. But that data is cached in .NET Core at application startup so it is not hitting the database again on each search or a web service, rather reading from the same cached list. And that list is optimized to contain only two fields, the product name and primary key.
Is there a way to pre-read the data for the list to make it faster?
Thanks
Wanting to add tooltips to column headers on the grid.
Trying:
$(document).ready(function () {
//grid header tooltip
$('thead [data-title]').kendoTooltip({
content: function (e) {
return $(e.target).text();
},
});
})
Seems to work except there appears to be spurious tooltips. Please see attached 1.png and 2.png.
These appear to be from title attributes from within child elements. Please see 3.png and 4.png.
In the case of 3.png the title="" attribute appears to be dynamically added.
Would like to remove the empty title="" tooltip and convert the column menu tooltip due to title="Column Menu" to be of kendoTooltip as well (preferably using single initialization step).
Hi;
I'm newbie to core and trying progress controls. I'm using razor pages and i couldn't find any sample about selecteditemchanged event usage for filling other controls from db.
Is it possible to give a short sample? If filling can be done serverside will be more happy :)
Thanks
How do you remove the "Add Task" button? My Gantt chart is completely driven from database values, so I don't want my users to be able to add tasks to the Gantt, they only need to see schedule.
Thanks
Ken
Hi,
I want to develop an editable grid using kendo in Asp.net core 2.
I am trying to install nuget package kendo grid in asp.net core 2
Kendo.MVC.UI
Kendo.MVC
However i am not able to get the through.
I am getting following version conflict.
Package Kendo.Mvc 2016.1.112 is not compatible with netcoreapp2.1 (.NETCoreApp,Version=v2.1). Package Kendo.Mvc 2016.1.112 supports:
Can you please help me with some demo version if its available.
Good morning,
I'm working on an web application and I was wondering the best way to go about initializing a prefiltered grid. Users see a flowchart of different statuses of a product, if they click on one of the statuses I would like it to go to the grid that I have with the status column filtered with the status that they selected.
I thought the best way to do this would be to create a separate method in the controller for each status, but that seemed a little clunky.
I currently have the status column as
columns.Bound(c => c.Status).Width(150)
.Title(
"Status"
)
.Filterable(filterable => filterable
.Cell(cell => cell
.ShowOperators(
false
)
.InputWidth(150)
.Operator(
"contains"
)
.SuggestionOperator(FilterType.Contains)
.Template(
"statusFilter"
)
)
);
function
statusFilter (element) {
element.element.kendoDropDownList({
dataSource: {
dataType:
"json"
,
transport: {
read:
"@Url.Action("
Status_Filter
", "
Controller
")"
}
},
optionLabel:
"--Select Status--"
});
}
Would I need to change how I have my filtering? Would you know how to do this?
Basic sample from https://demos.telerik.com/aspnet-core/autocomplete/index displays this in chrome console:
VM591:1 Uncaught TypeError: jQuery(...).kendoAutoComplete is not a function
....
Kendo UI is working fine for every control except autocomplete. There are multiple controls on this page besides the autocomplete.. Even the basic asp.net core demos do not work at all. What extra configuration steps are needed to actually get this to work? I also noticed that much of the samples have big chunks of code missing, such as the virtualization demo.
Hello!
Could you please provide this Kendo UI for jQuery example implemented with ASP.NET Core tag helpers? https://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/Templates/grid-with-checkbox-column
For some reason I can't get it to work properly. Does this work with batch editing and inline editing?
Best regards,
Kaan
Using .NET Core, have a grid bound to a local data source. We are adding a similar item after selecting via a multiselect control. We have this working, however when we add it to the bound data source, any CSS changes we may have made to other rows disappear. We are trying to make it so the CSS is either retained on the existing row or where we can restore it via an "item data bound" like event.
From the code below, I'm assuming the changed event on the data source occurs before the grid is rebound. And I cannot seem to identify a valid event on the grid for after the grid has been rebound to restore any CSS placed from the remove command.
Grid:
<kendo-grid name="TaskGrid" persist-selection="true" selectable="single row" height="300" datasource-id="gridDataSource" on-page="LoadRoleToTask()">
<columns>
<column hidden="true" field="TaskId" />
<column title="Task" field="TaskName" />
<column>
<commands>
<column-command name="Remove" click="RemoveTask" text="Remove"></column-command>
</commands>
</column>
</columns>
<groupable enabled="false" />
<sortable enabled="true" allow-unsort="false" initial-direction="ascending" />
<filterable enabled="true" />
</kendo-grid>
Javascript:
var gridDataSource = new kendo.data.DataSource({ change: AddCSS });
function LoadRoleToTask()
{
@foreach(var r2t in Model.RoleToTasks)
{
<text>
var roleToTask =
{
TaskId: "@r2t.TaskId",
TaskName: "@r2t.TaskName",
IsDeleted: false
};
gridDataSource.add(roleToTask);
</text>
}
}
function AddCSS(e)
{
var grid = $("#TaskGrid").data("kendoGrid");
if (!grid) return;
var headerCells = grid.element.find("th");
for (var row = 0; row < grid.dataSource.total(); row++)
{
var dataItem = grid.dataSource.at(row);
var rowCells = grid.element.find("tr[data-uid=" + dataItem.uid + "] td");
var currentTask = FindTask(dataItem.TaskId);
if (!currentTask.isDeleted) continue;
for (var i = 1; i < headerCells.length; i++)
{
var cell = $(rowCells[index]);
cell.addClass("deletedRole");
}
}
}
function AddTask()
{
var multi = $("#TaskMultiSelect").getKendoMultiSelect();
var multiDataItems = multi.dataItems();
if (multiDataItems.length == 0) return;
for (var i = 0; i < multiDataItems.length; i++)
{
var selectedTask = multiDataItems[i];
var currentTask = FindTask(selectedTask.TaskId);
if (currentTask) continue; //if already in data source, don't re-add
var newRole =
{
TaskId: selectedTask.TaskId,
TaskName: selectedTask.Name,
IsDeleted: false
};
gridDataSource.add(newRole); //successful but removes any CSS already in place
}
}
function RemoveTask(e)
{
e.preventDefault();
var grid = $("#TaskGrid").data("kendoGrid");
var headerCells = grid.element.find("th");
var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
var rowCells = grid.element.find("tr[data-uid=" + dataItem.uid + "] td");
var currentTask = FindTask(dataItem.TaskId);
if (!currentTask.IsDeleted)
{
currentTask.IsDeleted = true;
e.target.innerText = "Undo";
for (var index = 1; index < headerCells.length; index++)
{
var cell = $(rowCells[index]);
cell.addClass("deletedRole");
}
}
else
{
currentTask.IsDeleted = false;
e.target.innerText = "Remove";
for (var index = 1; index < headerCells.length; index++)
{
var cell = $(rowCells[index]);
cell.removeClass("deletedRole");
}
}
}
function FindTask(taskId)
{
for (var i = 0; i < gridDataSource.data().length; i++)
{
var currentTask = gridDataSource.data()[i];
if (currentTask && currentTask.TaskId == taskId)
{
return currentTask;
}
}
}