Hi,
I would like to enable horizontal scrolling but disable vertical scrolling. Is this possible?
Thanks.
Hi all,
I have a grid with custom transport in an ASP.NET MVC application that calls a Web API by URL. I would like to hide the URL when a user views the page source. Does anyone know of any methods to do this?
Best,
Ruben

I am using Chrome 61.0.3163.100
Compare the menus at
http://demos.telerik.com/aspnet-mvc/menu
to those at
http://demos.telerik.com/kendo-ui/menu/index
The Razor menu helper produces a menu with 'twist' triangles that are much closer to menu text and look pretty awful at that spacing. Also, the MVC example does not properly specify the #megaStore background image -- This console shows "GET http://demos.telerik.com/content/web/menu/header.jpg 404 (Not Found)"
Question: Is there an option or setting to use in the Razor menu helper to make the rendering more like the kendoui one ?

Hello,
I'm currently searching for a smart way to display the number of selected rows in a Grid.
In my grid I have a select column to select items and a second column that shows the information:
columns.Select().Width(30);columns.Bound(item => item.Name).ClientFooterTemplate("All items: #=count#");
This is the corresponding aggregate for the item counter:
.Aggregates(aggregates => aggregates.Add(item => item.Name).Count())
What I want to archive is that the footer template is also showing the number of selected items.
Pseudocode (which is obviously not working):
columns.Bound(item => item.Name).ClientFooterTemplate("All items: #=count#<br>Selected items: #=selectedCount#")
The only way I found to show the selected item count is to manipulate the DOM ($(".k-footer-template td:nth-child(2)")) when the grid change event is firing.
Does anybody have a smarter solution for my problem?
Any help is appreciated!
Regards
Raphael
Hi,
I have a grid with a detail template that contain a child grid.
I receive upfront data for main and child grids.
Foreach grid I need to have an inline ajax create and foreach row an inline ajax edit.
- After some research I follow the approach suggested on http://www.telerik.com/forums/grid-bind-a-clientdetailtemplate-to-a-collection-in-parent-row.
On DetailInit it populates right the data for the child, but after kendo hits "endRequest" event... delete entirely the data populated on detailInit.
- I follow this post: http://www.telerik.com/forums/clienttemplate-loaded-from-collection-in-parent-row---prevent-request.
but the add and edit features break with this approach.
In an Ideal scenario I want a grid and child grids binded upfront from the model. and be able to add or edit in an ajax way.
How can I solve this issue?
Hi there,I want to tab through a batch edit grid and i have certain columns that are non-editable (unamed column, Ministry Group, Age Category And Annual ( i use e.closeCell in javascript for the Annual column) ). Right now, i am able to Tab through the grid though partially. The problems i am running into is
1.) When i tab through the grouped section (People Reached) of the grid, it works fine but any thing past the first 3 rows and tabbing no longer works.
So my question ultimately is how do i make it jump to the next grouped section(People Trained) and Tab through and so on and so forth.
Here is my code Index.cshtml
01.@(Html.Kendo().Grid<P2I_UI.Models.ViewM.PlanPeopleVM>()02. .Name("PlanPepole")03. .Columns(columns =>04. {05. columns.Bound(e => e.PeopleCategoryName).Title("").Width(154).ClientGroupFooterTemplate("Total");06. columns.Bound(e => e.MinistryGroupCategoryName).Title("Ministry Group").Width(2);07. columns.Bound(e => e.AgeCategoryName).Title("Age Category").Width(2);08. columns.Bound(e => e.PeopleQ1).Title("Q1").Width(79).ClientGroupFooterTemplate("#=kendo.toString(sum,',0')#");09. columns.Bound(e => e.PeopleQ2).Title("Q2").Width(79).ClientGroupFooterTemplate("#=kendo.toString(sum,',0')#");10. columns.Bound(e => e.PeopleQ3).Title("Q3").Width(79).ClientGroupFooterTemplate("#=kendo.toString(sum,',0')#");11. columns.Bound(e => e.PeopleQ4).Title("Q4").Width(79).ClientGroupFooterTemplate("#=kendo.toString(sum,',0')#");12. columns.Bound(e => e.Annual).Width(79).ClientGroupFooterTemplate("#=kendo.toString(sum,',0')#");13. })14. .ToolBar(toolbar =>15. {16. toolbar.Save();17. })18. .Editable(editable => editable.Mode(GridEditMode.InCell))19. //.Navigatable()20. .Events(events =>21. {22. events.DataBound("Ppg_Uneditable_ColandRow");23. events.SaveChanges("disableBeforeUnload");24. events.Edit("onEditPlanPepole");25. })26. .DataSource(dataSource => dataSource27. .Ajax()28. .ServerOperation(false)29. .Aggregates(aggregates =>30. {31. aggregates.Add(p => p.PeopleCategoryName).Count();32. aggregates.Add(p => p.PeopleQ1).Sum();33. aggregates.Add(p => p.PeopleQ2).Sum();34. aggregates.Add(p => p.PeopleQ3).Sum();35. aggregates.Add(p => p.PeopleQ4).Sum();36. aggregates.Add(p => p.Annual).Sum();37. })38. .Batch(true)39. .Model(model =>40. {41. model.Id(p => p.PlanPeopleID);42. model.Field(p => p.PeopleCategoryName).Editable(false);43. model.Field(p => p.MinistryGroupCategoryName).Editable(false);44. model.Field(p => p.AgeCategoryName).Editable(false);45. })46. .PageSize(30)47. .Group(groups => groups.Add(p => p.PeopleCategoryID))48. .Read(read => read.Action("People_Read", "PlanPeople"))49. )50.)
JavaScrpt
01.$(function () {02. 03. var grid = $('#PlanPepole').data('kendoGrid');04. 05. grid.table.on('keydown', function (e) {06. if (e.keyCode === kendo.keys.TAB && $($(e.target).closest('.k-edit-cell'))[0]) {07. e.preventDefault();08. var currentNumberOfItems = grid.dataSource.view().length;09. var row = $(e.target).closest('tr').index();10. 11. 12. var dataItem = grid.dataItem($(e.target).closest('tr'));13. var field = grid.columns[col].field;14. var value = $(e.target).val();15. dataItem.set(field, value);16. var nextCellCol = 3;17. 18. if (row >= 0 && row < currentNumberOfItems && col >= 0 && col < grid.columns.length) {19. console.log("this is col:", col);20. var nextCellRow;21. if (col === 3) {22. nextCellCol = 5;23. }24. else if (col === 4) {25. nextCellCol = 6;26. }27. else if (col === 5) {28. nextCellCol = 7;29. }30. else if (col === 6) {31. nextCellCol = 4;32. }33. 34. if (e.shiftKey) {35. nextCellRow = nextCellCol === 4 ? row : row - 1;36. } else {37. nextCellRow = nextCellCol === 4 ? row + 1 : row;38. }39. 40. if (nextCellRow >= currentNumberOfItems || nextCellRow < 0) {41. return;42. }43. 44. // wait for cell to close and Grid to rebind when changes have been made45. setTimeout(function () {46. grid.editCell(grid.tbody.find("tr:eq(" + nextCellRow + ") td:eq(" + nextCellCol + ")"));47. });48. }49. }50. });51. 52.})
And i also attached an image of the grid
Thank you.
Hi!
I have the following lines in my _Layout.cshtml:
@Html.Kendo().AutoComplete().Name("search").DataTextField("Name").MinLength(3).Placeholder("Search...").DataSource(source => source.Read(read => read.Action("GetSiteInfos", "SiteInfo"))).AutoWidth(true).HtmlAttributes(new { style = "width: 50%;" }).Events(ev => ev.Select("onSiteSelect"))
and the Javascript for the selection is:
<script type="text/javascript">
function onSiteSelect(e) {
var selected = this.dataItem($(e.item));
var id = selected.Id;
$("#selectedSiteId").val(id);
}
</script>
It's working perfectly: the value of the field 'id' is stored in a HiddenField:
@Html.Hidden("selectedSiteId")
Now my problem is, that I have a TabStrip in this _Layout.cshtml and I would like to show some database results for the selected Id depending on the page I choose in the TabStrip.
@Html.Kendo().TabStrip().Name("siteTabStrip").Animation(animation => animation.Open(effect => effect.Fade(FadeDirection.In))).Items(tabstrip =>
{
tabstrip.Add().Text("First page").Content(@Html.Partial("_FirstPartial").ToHtmlString());
tabstrip.Add().Text("Second page").Selected(true).Content(@Html.Partial("_SecondPartial").ToHtmlString());
}).HtmlAttributes(new { @class = "k-state-active" })
How can I pass the hidden field value to the TabStrip item? Every TabStrip page will show a partial view. These partial views should call an action with the Id as a parameter and will show us different results from database. But this TabStrip will be rendered as soon as I load the page and before using the AutoComplete!
Thanks for your help.

| multiple custom group footer template names | |
I have my grid.
<div class="grid-scrollable">
<div>
@(Html.Kendo().Grid<ViewModels.Payment.BhFormExpenseRRViewModel>()
.Name("BHFormPATHRRGrid")
.Events(e => e.DataBound("dataBoundpath"))
.Events(e => e.Save("onBhFormpathModelGridSave"))
.Events(e => e.Edit("onBhFormpathModelGridEdit"))
.Columns(columns =>
{
columns.Bound(p => p.Id).Hidden(true);
columns.Bound(p => p.ECId).Hidden(true);
columns.Bound(p => p.ExpenseCategory).ClientFooterTemplate("Total Payment Requested")
.ClientGroupFooterTemplate("Total Expenses").EditorTemplateName("Decimal").Format("{0:c}");
columns.Group(g => g.Title("Current Month Expenses")
.Columns(a =>
{
a.Bound(c => c.ThisMonthPath).EditorTemplateName("Decimal").Format("{0:c}").ClientFooterTemplate("#=kendo.toString(sum,'C')#")
.ClientGroupFooterTemplate("#=kendo.toString(sum,'C')#");
a.Bound(c => c.ThisMonthMatch).EditorTemplateName("Decimal").Format("{0:c}").ClientFooterTemplate("#=kendo.toString(sum,'C')#")
.ClientGroupFooterTemplate("#=kendo.toString(sum,'C')#");
}));
columns.Group(g => g.Title("Reduced Monthly Expenses")
.Columns(a =>
{
a.Bound(c => c.ReduceExpensesBy).EditorTemplateName("Decimal").Format("{0:c}").ClientFooterTemplate("#=kendo.toString(sum,'C')#")
.ClientGroupFooterTemplate("#=kendo.toString(sum,'C')#");
a.Bound(c => c.CurrentMonthExpensesSubmitted).EditorTemplateName("Decimal").Title("AdjustedPathAmount").Format("{0:c}").ClientFooterTemplate("#=kendo.toString(sum,'C')#")
.ClientGroupFooterTemplate("#=kendo.toString(sum,'C')#");
}));
columns.Group(g => g.Title("Prior Month Expenses")
.Columns(a =>
{
a.Bound(c => c.PriorMonthMatch).Format("{0:c}").ClientFooterTemplate("#=kendo.toString(sum,'C')#")
.ClientGroupFooterTemplate("#=kendo.toString(sum,'C')#");
a.Bound(c => c.PriorMonthPath).Format("{0:c}").ClientFooterTemplate("#=kendo.toString(sum,'C')#")
.ClientGroupFooterTemplate("#=kendo.toString(sum,'C')#");
}));
columns.Group(g => g.Title("Cumulative Expenses YTD")
.Columns(a =>
{
a.Bound(c => c.YtdMonthMatch).Format("{0:c}").ClientFooterTemplate("#=kendo.toString(sum,'C')#")
.ClientGroupFooterTemplate("#=kendo.toString(sum,'C')#");
a.Bound(c => c.YtdMonthPath).Format("{0:c}").ClientFooterTemplate("#=kendo.toString(sum,'C')#")
.ClientGroupFooterTemplate("#=kendo.toString(sum,'C')#");
}));
columns.Command(command =>
{
command.Edit().HtmlAttributes(new { @class = "btn-primary k-grid-edit" });
}).Width(200);
})
.Editable(editable => editable.Mode(Kendo.Mvc.UI.GridEditMode.InLine))
.Pageable(pageable => pageable.Refresh(true).PageSizes(true).ButtonCount(5))
.Sortable()
.Filterable(f => f.Operators(o => o.ForString(s => s.Clear()
.Contains("Contains")
.DoesNotContain("Does not contain")
.IsEqualTo("Is equal to")
.IsNotEqualTo("Is not equal to")
.StartsWith("Starts with")
.EndsWith("Ends with "))))
.Selectable()
.Resizable(resize => resize.Columns(true))
.DataSource(dataSource => dataSource.Ajax().PageSize(20).Model(model => model.Id(p => p.ECId)).Model(model => model.Field(p => p.TotalProirExpensesBilled).Editable(false)).Model(model => model.Field(p => p.CurrentMonthExpensesSubmitted).Editable(false)).Model(model => model.Field(p => p.TotalExpensesYtd).Editable(false)).Model(model => model.Field(p => p.ExpenseCategory).Editable(false))
.Model(model => model.Field(p => p.PriorMonthMatch).Editable(false)).Model(model => model.Field(p => p.PriorMonthPath).Editable(false)).Model(model => model.Field(p => p.YtdMonthMatch).Editable(false)).Model(model => model.Field(p => p.YtdMonthPath).Editable(false))
.Aggregates(aggregates =>
{
aggregates.Add(p => p.ThisMonthMatch).Sum();
aggregates.Add(p => p.ThisMonthPath).Sum();
aggregates.Add(p => p.PriorMonthMatch).Sum();
aggregates.Add(p => p.PriorMonthPath).Sum();
aggregates.Add(p => p.YtdMonthMatch).Sum();
aggregates.Add(p => p.YtdMonthPath).Sum();
aggregates.Add(p => p.ReduceExpensesBy).Sum();
aggregates.Add(p => p.CurrentMonthExpensesSubmitted).Sum();
})
.Update(update => update.Action("EditBHFormRR", "ReimbursementRequestProvider").Data("additionalInfoPath"))
.Events(events => events.Error("errorpath"))
.Group(groups => groups.Add(p => p.ExpenseTypeId))
.Read(read => read.Action("BHFromExpenseGridRead", "ReimbursementRequestProvider", new { bhFormName = Model.BHFormsName, reimbursementEbsId = Model.ReimbursementEbsId, prrId = Model.PrrId, rrState = @ViewBag.RRStateRequest, serviceMonth = Model.ServiceMonth }))
)
)
</div>
</div>
my requirement is
change group client footer of group 1 to "Total Payment Requested" instead of "Total Expenses"
change group client footer of group 2 to "Total Match Claimed" instead of "Total Expenses"
TOTAL OF TOTAL AS "Total Billing Submitted" instead of "Total Payment Requested"
the issue is I have name the group client footer on custom basis.
example group 1 sum footer name should be something different than group 2 sum footer name.
can any one help me on this please?

Hi Team ,
I am trying to add Kendo dropdownlist as part of Grid one grid column using EditorTemplates and it was successfully added but it was not binded to model and it was not reflect in cell which is selected from kendo dropdownlist.
I am usinh MVC5 and Kendo version 2015.1.429
Here is my code
.Grid<TEData.Model.Gen_Lists>().Deferred()
.Name("grdGen")
.Columns(cl =>
{
cl.Bound(u => u.TED_ENT_DATA_DAY_GEN_ID).Hidden(true);
cl.Bound(u => u.hourEnding).Width("10ex");
cl.Bound(u => u.actual).Width("10ex").Title("Actual");
//cl.Bound(u => u.Actual_Reason.reasonName).Title("Reason").EditorTemplateName("ReasonEditor").ClientTemplate("#:Actual_Reason.reasonName #");
cl.Bound(u => u.Actual_Reason).Title("Reason").ClientTemplate("#:Actual_Reason.reasonName #");
cl.Bound(u => u.actual_Reason_Notes).Title("Notes");
cl.Bound(u => u.totalCapacity).Title("Total Capacity").Width("10ex");
cl.Bound(u => u.totalCapacity_Reason.reasonName).Title("Reason").EditorTemplateName("ReasonEditor").ClientTemplate("#:totalCapacity_Reason.reasonName #");
cl.Bound(u => u.totalCapacity_Reason_Notes).Title("Notes");
cl.Bound(u => u.runState).Title("Run State").Width("10ex");
cl.Bound(u => u.runState_Reason.reasonName).Title("Reason").EditorTemplateName("ReasonEditor").ClientTemplate("#:runState_Reason.reasonName #");
cl.Bound(u => u.runState_Reason_Notes).Title("Notes");
//cl.Bound(u => u.reasonlist).ClientTemplate("#: reasonlist.reasonName#");
//cl.Bound(u => u.reasonlist.reasonCode).EditorTemplateName("ReasonEditor").ClientTemplate("#:reasonlist.reasonName #");
})
.Sortable()
//.Scrollable()
.Editable(ed => ed.Mode(GridEditMode.InCell))
.DataSource(ds =>
{
ds.Ajax()
.Batch(true)
.ServerOperation(false)
.Model(
m => {
m.Id(u => u.TED_ENT_DATA_DAY_GEN_ID);
m.Field(u => u.hourEnding).Editable(false);
//m.Field(u => u.reasonlist).DefaultValue(ViewData["defaultReason"] as TEData.Model.Gen_Lists);
}
)
.Read(rd => rd.Action("Get_Data", "TECommon")
.Data("userInput")
);
})
EditorTemplates Code
@model TEData.Model.ReasonCode_Lists
@(Html.Kendo()
.DropDownListFor(m => m.reasonName)
.Name("ddlEditor")
.DataTextField("reasonName")
.DataValueField("reasonCode")
.DataSource(d=>d.Read(r=>r.Action("Get_Reason_Codes", "TECommon")))
)
I have tried some sample from telerik and it was not helped me. Please help me
http://demos.telerik.com/aspnet-mvc/grid/editing-custom
Thanks,
Vetri.

