
Hello,
I want to create a helper method that wraps a Kendo UI widget as described here:
http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/faq#how-to-create-helper-methods-rendering-predefined-widgets-i-can-further-configure
using Kendo.Mvc.UI;using Kendo.Mvc.UI.Fluent;using Microsoft.AspNetCore.Mvc.ViewFeatures;namespace Gpdb.Helpers{ public static class HtmlHelperExtensions { public static GridBuilder<T> MyKendoGrid<T>(this HtmlHelper helper, string name) where T : class { return helper.Kendo().Grid<T>() .Name(name) .Groupable() .Pageable() .Sortable() .Scrollable() .Filterable() .Pageable(); } }}but this doesn't work because of the following error (see attached Picture) - what I'm missing?
The grid below defaults to 10 records per page. Is there a way to change this value?
Thanks!
@(Html.Kendo().Grid(Model).Name("Orders").Columns(c =>
{
c.Bound(m => m.WORK_ORD_NO);
c.Bound(m => m.WMS_STATUS);
c.Bound(m => m.WO_STATUS);
c.Bound(m => m.LINKED_ORDER);
c.Bound(m => m.ASSIGNED_TO);
c.Bound(m => m.SHIPPER_NO);
c.Bound(m => m.QUANTITY);
c.Bound(m => m.REQ_SHIP_DATE);
c.Bound(m => m.EST_SHIP_DATE);
c.Bound(m => m.ACT_SHIP_DATE);
})
.Sortable()
.Filterable()
.Pageable()
.Groupable()
)
Hi,
Why isn't it possible to disable/hide the ColumnMenu on specific columns like Filterable or Sortable i.e. ColumnMenu(false)
robert

I have a grid that has an option to export in PDF, how can i export the pdf calling a report of telerik?
The thing is that when i click the button on to export in PDF i want that the export to be with the report of telerik that i made with the telerik reports designer.
is that possible?
I hope someone can help me.
Big hugs.
How can i export to PDF only the rows that has a column check?.
I found this example in Export to Excell http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/excel/export-checked-columns-only
Is possible to do this with PDF Export? If anyone has an example of how to do this, I will appreciate it.
I am using the `scrollable.Virtual` option on my grid. What i'm trying to do is paginate 4000 rows into 50 per page and have the next set load on scroll. The problem is that when I first load the grid it loads all 4000 records, then when i scroll to the 51st record it pulls all 4000 records again.
This is my code
@(Html.Kendo().Grid<EmployeeMasterView>() .Name("grid") .ToolBar(tools => tools.Excel()) .Excel(e => e.AllPages(true)) .Excel(excel => excel .FileName("List.xlsx") ) .Columns(columns => { columns.Bound(e => e.EmployeePicture).ClientTemplate("<img src='" + Url.Content("~/#: EmployeePicture#") + "' height='50px' width='50px' />").HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Picture", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Picture", GlobalVariables.LanguageID)).Width(100); columns.Bound(e => e.FirstName).Width(120).ClientTemplate("<a href='" + Url.Action("Index", "Employees", new { E = "#: EmployeeID#", M = "Info" }) + "' >#: FirstName#</a>").HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("FirstName", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("FirstName", GlobalVariables.LanguageID)); columns.Bound(e => e.LastName).Width(120).ClientTemplate("<a href='" + Url.Action("Index", "Employees", new { E = "#: EmployeeID#", M = "Info" }) + "' >#: LastName#</a>").HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("LastName", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("LastName", GlobalVariables.LanguageID)); columns.Bound(e => e.dispEmployeeID).Width(120).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("EmployeeID", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("EmployeeID", GlobalVariables.LanguageID)); columns.Bound(e => e.Email).ClientTemplate("<a href='mailto:" + "#: Email#" + "' title='" + "#: Email#" + "'>" + "<i class='list-icon-mail fa fa-envelope-o fa-lg fa-fw'></i></a>").Width(100).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Email", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Email", GlobalVariables.LanguageID)); columns.Bound(e => e.dispDept).Width(155).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Department", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Department", GlobalVariables.LanguageID)); columns.Bound(e => e.StrGender).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Gender", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Gender", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.DateEmpInactivated).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Date Employee Inactivated", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Date Employee Inactivated", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.InactivatedReason).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Inactivated Reason", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Inactivated Reason", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.JobCategory).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Job Category", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Job Category", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.WorkSiteID).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("WorkSiteID", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("WorkSiteID", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.WorkSiteLocation).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Work Site Location", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Work Site Location", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.EmployeeWorkAddress).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Employee Work Address", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Employee Work Address", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.TerminationDate).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Termination Date", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Termination Date", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.disbStartDate).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Start Date", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Start Date", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.dispPos).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Position", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Position", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.SSN).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("SSN", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("SSN", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.State).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("State", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("State", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.EmployeementStatus).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Work Status", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Work Status", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.dispBirthDate).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Birthdate", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Birthdate", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.dispDOH).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Original Hire Date", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Original Hire Date", GlobalVariables.LanguageID)).Hidden(true); columns.Bound(e => e.BlnInactive).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Inactive", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Inactive", GlobalVariables.LanguageID)).Hidden(true).ClientTemplate("<input type='checkbox' #= BlnInactive ? checked='checked' : '' # disabled='disabled'></input>"); //columns.Bound(e => e.dispDept).HeaderHtmlAttributes(new { @title = FieldTranslation.GetLabel("Dept Desc", GlobalVariables.LanguageID) }).Title(FieldTranslation.GetLabel("Dept Desc", GlobalVariables.LanguageID)).Hidden(true); }) .Sortable() // .Scrollable(scrollable => scrollable.Virtual(true)) .Scrollable(scrollable => scrollable.Virtual(true)) .Groupable() .ColumnMenu() //.Pageable() .Filterable() .ClientDetailTemplateId("template") .HtmlAttributes(new { style = "height:600px;" }) .Reorderable(reorder => reorder.Columns(true)) .Resizable(resize => resize.Columns(true)) .DataSource(dataSource => dataSource .Ajax() .PageSize(50) .Read(read => read.Action("DetailTemplate_Employees", "Employees")) ) .Events(events => events.DataBound("dataBound")) )
What I am trying to achieve is on first load it has the first 50 rows, then on scroll loads the next 50...and doesn't pull all 4000 records each time I scroll to the next 50.
According to this demo here there is supposed to be a .Filter() event for the Grid. But when I try to us it in my code, just as it is in that demo, it is undefined. There is no Filter() event. Or is there? Which is it?

Currently, the Grid Excel export will not export columns that have a client template defined on them.
The answer from Telerik HERE, solves the issue in a static way. Meaning that for each column that has a client template definition, you will have to alter the script to add the other columns.
function excelExport(e) {
var sheet = e.workbook.sheets[0];
var employeeTemplate = kendo.template(this.columns[0].template);
var employerTemplate = kendo.template(this.columns[1].template);
//Add more template variables and set them to the column index in the grid.
var data = this.dataSource.view();
for (var i = 0; i < data.length; i++) {
sheet.rows[i + 1].cells[0].value = employeeTemplate(data[i]);
sheet.rows[i + 1].cells[1].value = employerTemplate (data[i]);
//Add the cell values by column index from the template v
}
}
Here is a script to dynamically get all of the columns with client templates :
Grid HTML Helper:
@(Html.Kendo().Grid<Employee>()
.Name("employeeGrid")
.ToolBar(t => { t.Create(); t.Save(); t.Excel(); })
.Events(e => e.ExcelExport("excelExportDynamic"))
.Columns(col =>
{
col.Bound(c => c.Employee).ClientTemplate("#: data.Employee#");
col.Bound(c => c.Employer).ClientTemplate("#: data.Employer#);
col.ForeignKey(c => c.Status, Model, "StatusID", "StatusCode").Title("Status");
col.Command(c => c.Destroy());
})
//Removed for brevity
Javascript function:
<script>
function excelExportDynamic(e) {
var sheet = e.workbook.sheets[0];
var colTemplates = []; //Initialize new array
var data = this.dataSource.view();
for (var i = 0; i < this.columns.length; i++) {
if (this.columns[i].template) {
colTemplates.push(kendo.template(this.columns[i].template)); //Add kendo template to colTemplate array if it exists for the given index's column
} else {
colTemplates.push(null); //Add null to given index if template does not exist for the column index. This ensures columns are mapped to the proper index.
}
}
//colTemplate array has been built now: Example of array at this point) colTemplate: { templateCol[0], null, templateCol[3], null, null }
for (var i = 0; i < colTemplates.length; i++) {
for (var j = 0; j < data.length; j++) {
if (colTemplates[i] != null) {
sheet.rows[j + 1].cells[i].value = colTemplates[i](data[j]); //Loop through all colTemplates and all data in the grid to build the excel sheet. Skip null colTemplates.
}
}
}
}
</script>
Hope this helps!!!!!
