I'm trying to make the text label not crowded in a lot of data and I can not successful.

https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/events/remove
I am using the above event to refresh other grids on the page when a specific grid has a row deleted.
My test code is as follows:
@(Html.Kendo().Grid<ViewModel> () .Name("kGrid") .Events(e => { e.Remove("alert('hello')"); })
The rest of the code is omitted as it is not relevant.
The "hello" is triggering on page load, and not triggered at all when a row is confirmed removed. Am I missing something?
Recently I've been working with telerik devcraft for the last couple of weeks, I'm interested in using the grid controller to display data, I've reached the point where I'm working with CRUD operations and I need to led the user make delete, create and edit operations of the displayed rows my client really doesn't like the way the controller displays the edit and delete buttons next to the rows, he would like to be available to invoke the edit and delete operations via external html buttons on the bottom of the page

Hi there guys and gals, I have a grid and i am try to hide and show columns based on the selected month from a drop-down list. If selected month is January, then show the JComment column if it is February, then hide the JComment column and show the FComment column. The hide and show functionality works but unfortunately, it breaks the grid appearance, the all columns are compressed in width and blank space on the right of the grid appears. i have tried calling the resize grid function, i have tried fixing this through css, but to no avail. How do i fix this?
Here is the Grid logic
@(Html.Kendo().Grid<P2I_UI.Models.ViewM.MinistryImpactVM>() .Name("peopleMinistryImpact") .Columns(columns => { columns.Bound(c => c.StatisticName).Title("StatisticName ").Width(35); columns.Bound(c => c.MinistryGroup).Title("Ministry <br/> Group").Width(25); columns.Bound(c => c.AgeGroup).Title("Age").Width(25); columns.Bound(c => c.AnnualGoal).Title("Annual <br/> Goal").Width(30).ClientTemplate("#=(AnnualGoal == null) ? ' ' : kendo.toString(AnnualGoal,',0')#"); columns.Bound(c => c.October).Title("Oct.").Width(30).ClientTemplate("#=(October == null) ? ' ' : kendo.toString(October,',0')#"); columns.Bound(c => c.November).Title("Nov.").Width(30).ClientTemplate("#=(November == null) ? ' ' : kendo.toString(November,',0')#"); columns.Bound(c => c.December).Title("Dec.").Width(30).ClientTemplate("#=(December == null) ? ' ' : kendo.toString(December,',0')#"); columns.Bound(c => c.January).Title("Jan.").Width(30).ClientTemplate("#=(January == null) ? ' ' : kendo.toString(January,',0')#"); columns.Bound(c => c.JanuaryComment).Title("JComment.").Width(50).Hidden(); columns.Bound(c => c.February).Title("Feb.").Width(30).ClientTemplate("#=(February == null) ? ' ' : kendo.toString(February,',0')#"); columns.Bound(c => c.FebruaryComment).Title("FComment.").Width(50).Hidden(); columns.Bound(c => c.March).Title("Mar.").Width(30).ClientTemplate("#=(March == null) ? ' ' : kendo.toString(March,',0')#"); columns.Bound(c => c.MarchComment).Title("MComment.").Width(50).Hidden(); columns.Bound(c => c.April).Title("Apr.").Width(30).ClientTemplate("#=(April == null) ? ' ' : kendo.toString(April,',0')#"); columns.Bound(c => c.May).Title("May.").Width(30).ClientTemplate("#=(May == null) ? ' ' : kendo.toString(May,',0')#"); columns.Bound(c => c.June).Title("Jun.").Width(30).ClientTemplate("#=(June == null) ? ' ' : kendo.toString(June,',0')#"); columns.Bound(c => c.July).Title("Jul.").Width(30).ClientTemplate("#=(July == null) ? ' ' : kendo.toString(July,',0')#"); columns.Bound(c => c.August).Title("Aug.").Width(30).ClientTemplate("#=(August == null) ? ' ' : kendo.toString(August,',0')#"); columns.Bound(c => c.September).Title("Sep.").Width(30).ClientTemplate("#=(September == null) ? ' ' : kendo.toString(September,',0')#"); columns.Bound(c => c.FiscalYearToDate).Title("FYTD.").Width(30).ClientTemplate("#=(FiscalYearToDate == null) ? ' ' : kendo.toString(FiscalYearToDate,',0')#"); columns.Bound(c => c.PercentageOfPlan).Title("% of <br/> Plan.").Width(30).ClientTemplate("#=(PercentageOfPlan == null) ? ' ' : kendo.toString(PercentageOfPlan,'p')#"); }) .ToolBar(toolbar => { toolbar.Save(); }) .Editable(editable => editable.Mode(GridEditMode.InCell)) .Events(events => { events.Edit("onEditMinistryImpact"); }) .AutoBind(false) .DataSource(dataSource => dataSource .Ajax() .Sort(s => { s.Add(p => p.SortOrder).Ascending(); s.Add(p => p.MinistryGroupCategoryID).Ascending(); s.Add(p => p.AgeCategoryID).Ascending(); }) .ServerOperation(false) .Batch(true) .Model(model => { model.Id(p => p.MinistryImpactID); model.Field(p => p.StatisticName).Editable(false); model.Field(p => p.MinistryGroup).Editable(false); model.Field(p => p.AgeGroup).Editable(false); model.Field(p => p.FiscalYearToDate).Editable(false); model.Field(p => p.PercentageOfPlan).Editable(false); }) .Read(read => read.Action("MinistryImpact_Read", "MinistryImpact").Data("additionalData")) .Update(update => update.Action("MinistryImpact_Update", "MinistryImpact")) ))
Js Logic
function onMonthChange(e){ var selectedMonthIndex = this.value(); var peopleMinistry = $("#peopleMinistryImpact").data("kendoGrid"); if (parseInt(selectedMonthIndex) === parseInt(0)) { peopleMinistry.showColumn("JanuaryComment"); peopleMinistry.hideColumn("FebruaryComment"); peopleMinistry.hideColumn("MarchComment"); } else if (parseInt(selectedMonthIndex) === parseInt(1)) { peopleMinistry.hideColumn("JanuaryComment"); peopleMinistry.showColumn("FebruaryComment"); peopleMinistry.hideColumn("MarchComment"); } else if (parseInt(selectedMonthIndex) === parseInt(2)) { peopleMinistry.hideColumn("JanuaryComment"); peopleMinistry.hideColumn("FebruaryComment"); peopleMinistry.showColumn("MarchComment"); } peopleMinistry.resize(); // force the layout readjustment without setting a new height peopleMinistry.resize(true)}CSS
<style> #peopleMinistryImpact.k-grid-header { padding: 0 !important; } #peopleMinistryImpact.k-grid-content { overflow-y: visible; } #peopleMinistryImpact > .k-grid-header > div > table, #peopleMinistryImpact > .k-grid-content > table { width: 100% !important; } #peopleMinistryImpact { min-width: 1250px; }</style>
Thanks for the help
Hello,
I have an application, in wich there is a combobox above a grid. If i choose a company in the Combobox, then the people of the company are shown in the grid.
I have now the problem with the edit button in the grid. If I change the company and after this click on the edit button, the edit popup do not open. Instead the grid fires the Read-Action. When i click a second time on the edit button, the edit popup is opening.
I attached a demo project with this problem. I remvoed the Kendo Css-files and Scripts to get a small zip-File. Just Reinstall the "Telerik.UI.for.AspNet.Mvc5" package. I use the version 2018.1.117
Thank you for your help.
Ralf
Hello,
Could some one help me the sorting issue? Records cannot be sorted by clicking on a column's header after I applying group on the grid. I am working on MVC project.
Thanks in advance.

I need to show the details of the grid for CRUD operations outside the grid (in a tabbed layout with the details and subgrids). The template is the same used in popup but it has to be in the same page that the grid.
Is there any way to achieve this? I've seen this example in the documentation but it's for jquery
http://dojo.telerik.com/upiPE/26
Thank you

I'm using a grid with editable mode set to pop up. On the actions I have included a route value to be sent to the controller. This route value gets sent on each of the CRUD calls except for the create.
Below is my Grid code with the route values for each of the actions. I really only need this value passed through for the Create and Read actions.
@(Html.Kendo().Grid(Model).Name("ApprovalProcessSteps").Columns(c =>{ c.Bound(e => e.ProcessStep); c.Bound(e => e.ProcessStepType); c.Bound(e => e.AndOr); c.Bound(e => e.GroupParentStep); c.Bound(e => e.UserId); c.Bound(e => e.RejectToStep); c.Bound(e => e.ReminderFrequency); c.Command(command => { command.Edit(); command.Destroy(); }).Width(200);}) .ToolBar(toolbar => toolbar.Create().Text("Create New Step")) .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("ApprovalProcessStepPopUp")) .Pageable(pager => pager.AlwaysVisible(false).PageSizes(new List<object> {5, 10, 20, 100})) .DataSource(dataSource => dataSource .Ajax() .PageSize(20) .Model(model => model.Id(p => p.Id)) .Create(update => update.Action("EditingPopup_Create", "ApprovalProcessSteps", new { approvalProcessId = ViewBag.approvalProcessId })) .Read(read => read.Action("EditingPopup_Read", "ApprovalProcessSteps", new { approvalProcessId = ViewBag.approvalProcessId })) .Update(update => update.Action("EditingPopup_Update", "ApprovalProcessSteps", new { approvalProcessId = ViewBag.approvalProcessId })) .Destroy(update => update.Action("EditingPopup_Destroy", "ApprovalProcessSteps", new { approvalProcessId = ViewBag.approvalProcessId }))) )
Below is my controller code. The route value gets pass to all but my Create call. Can any point me in the right direction on what I might be doing wrong.
public ActionResult EditingPopup_Read([DataSourceRequest] DataSourceRequest request, int approvalProcessId){ ViewBag.approvalProcessId = approvalProcessId; return Json(this.ReadInline(approvalProcessId).ToDataSourceResult(request));}[AcceptVerbs(HttpVerbs.Post)]public ActionResult EditingPopup_Create([DataSourceRequest] DataSourceRequest request, ApprovalProcessStep approvalProcessStep, int approvalProcessId){ if (approvalProcessStep != null && ModelState.IsValid) { this.CreateInline(approvalProcessStep, approvalProcessId); } return Json(new[] {approvalProcessStep}.ToDataSourceResult(request, ModelState));}[AcceptVerbs(HttpVerbs.Post)]public ActionResult EditingPopup_Update([DataSourceRequest] DataSourceRequest request, ApprovalProcessStep approvalProcessStep){ if (approvalProcessStep != null && ModelState.IsValid) { this.UpdateInline(approvalProcessStep); } return Json(new[] {approvalProcessStep}.ToDataSourceResult(request, ModelState));}[AcceptVerbs(HttpVerbs.Post)]public ActionResult EditingPopup_Destroy([DataSourceRequest] DataSourceRequest request, ApprovalProcessStep approvalProcessStep){ if (approvalProcessStep != null) { this.DestroyInline(approvalProcessStep); } return Json(new[] {approvalProcessStep}.ToDataSourceResult(request, ModelState));}
Hi,
I'm using an EditorTemplate to enable the user to select a person
@model Int64
@(Html.Kendo().ComboBox()
.Name("RepIRN")
.Filter("contains")
.Placeholder("Select a rep...")
.DataTextField("Text")
.DataValueField("Value")
.HtmlAttributes(new { style = "width:100%;" })
.Filter("contains")
.AutoBind(false)
.MinLength(3)
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetUsers", "AutoComplete");
})
.ServerFiltering(true);
})
)
The model that I'm displaying is
public class JobObjectModel
{
public long IRN { get; set; }
public string Rep { get; set; }
[UIHint("RepEditor")]
public long RepIRN { get; set; }
public string JobStatus { get; set; }
public string Promised { get; set; }
}
The combobox works fine except I can't figure out how I populate it with the rep value and rep name when the page loads the model.Everything else seems to work, if the user selects a value it is sent back to the controller fine etc.
I just can't figure out how I load the value (and text) when the page loads.
Below is how I populate the combobox
public JsonResult GetUsers(string text)
{
var sortedPeople = Database.GetPeople(text);
List<SelectListItem> items = new List<SelectListItem>();
foreach (var person in sortedPeople)
{
items .Add(new SelectListItem() { Text = person.FullName, Value = person.IRN.Value.ToString() });
}
return Json(items , JsonRequestBehavior.AllowGet);
}