or
1 answer
209 views
Hello,
I am struggling with why my Save button on my Kendo Grid is not calling my update action (inline edit mode). The edit column uses a dropdown list editor template. The dropdown list editor fills fine with my values and I can select one. But when I click the Save button (from toolbar) it does not call my add function in the controller. I see no errors in F12 utility. Any help is appreciated as I've been struggling with this all day.
Here is my relevant code:
Edit Grid:
<style>
.k-grid-content td {
position: relative;
}
.k-grid .k-grid-header .k-header .k-link {
height: auto;
}
.k-grid .k-grid-header .k-header .k-column-title .k-header {
white-space: normal;
}
</style>
@{
ViewData["Title"] = "Administration";
}
<div style="margin-left:10px; margin-top:10px">
<div>Manage Assignees</div>
<div class="row" style="margin-top:10px">
<div class="col-auto">
@(
Html.Kendo().Grid<Assignees>()
.Name("grid")
.Width("250px")
.Columns(columns =>
{
columns.Bound(p => p.SortName).Width(130).Title("Assignee").EditorTemplateName("AssigneesAdd");
})
.Sortable(true)
.Navigatable()
.Scrollable(scr => scr.Height(200))
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Selectable()
.AutoBind(true)
.ColumnMenu(false)
.ToolBar(tb =>
{
tb.Create().Text("New");
tb.Save().Text("Save").CancelText("Cancel");
})
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("GetAssigneesForAddGridDisplay", "Home").Type(HttpVerbs.Post))
.Update(update => update.Action("AddAssigneeRecord", "Home").Type(HttpVerbs.Post))
.Destroy(destroy => destroy.Action("DeleteAssigneeRecord", "Home").Type(HttpVerbs.Post))
.Events(e => e.Error("onError"))
.Batch(false)
.Model(model =>
{
model.Id(p => p.SortName);
model.Field(p => p.SortName);
})
)
.Deferred()
)
</div>
</div>
</div>
@section Scripts{
@Html.Kendo().DeferredScripts()
<script>
$(document).ready(function () {
});
function onError() {
@*window.location='@Url.Action("Index", "Error")';*@
}
</script>
}
===============================================
Controller Add Function called by .Update event in grid
[HttpPost]
public async Task<ActionResult> AddAssigneeRecordAsync([DataSourceRequest] DataSourceRequest request, SelectListItem assigneeRecord)
{
try
{
await _dataService.AddAssigneeRecordAsync(assigneeRecord);
return Json(await new[] { assigneeRecord }.ToDataSourceResultAsync(request, ModelState));
}
catch (Exception ex)
{
await _dataService.LogExceptionAsync("HomeController", "AddAssigneeRecordAsync", _username, ex);
return BadRequest();
}
}
===============================================
DropDownList editor template("AssigneesAdd"):
@using Estimating_State_Licensing_Certification.Controllers
@using Kendo.Mvc.UI
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@addTagHelper *, Kendo.Mvc
@model string;
@(Html.Kendo().DropDownListFor(m => m)
.DataValueField("Text")
.DataTextField("Text")
.Filter("startswith")
.OptionLabel("Select an Employee")
.DataSource(source =>
{
source.Read(read =>
{
//this is the edit template used for the Admin assignee grid for adding NEW assignees
read.Action("GetAssigneesForAdminAdd", "Home").Type(HttpVerbs.Post);
});
})
)
==============================================
"Assignees" class/entity used by the grid
public class Assignees
{
public string? SortName { get; set; } = string.Empty;
}
Thanks!
Acadia
Aleksandar
Telerik team
answered
on
25 Apr 2023
0 answers
121 views
I am not able to get the State dropdown menu to work with the browser autocomplete for address using Kendo control. See the screenshot below.
I have tried several versions but I am using a very, very simple drodpown for testing and it will not autocomplete:
@(Html.Kendo().DropDownList()//(m=>m.State)
.Name("state")
.BindTo(new List<SelectListItem>() {
new SelectListItem() {
Text = "AL",
Value = "AL"
},
new SelectListItem() {
Text = "AK",
Value = "AK",
}
})
.HtmlAttributes(new {style = "width: 100%", @class = "autocomplete-input"})
.DataTextField("Text")
.DataValueField("Value"))
Jordan
Top achievements
Rank 1
Iron
Rank 1
Iron
asked
on
27 Mar 2023
5 answers
352 views
Hello everyone,
I have a little problem with editing my grid and I hope you can help me.
I am currently developing a grid (Telerik UI for ASP.NET MVC Grid) in which you can open another grid using a button at the end of the row. In this second grid it is possible to select one or more employees (Inline Editing with a DropDown) for the previous entry. In addition to the actual employee, there is another column where you can set a checkbox to "true" or "false". You can create a new entry with the button on the top left and you can edit or delete it with the two buttons on the right in the line.
Now to my question: My plan is that the name of the employee can only be changed when creating the entry. If you click on Edit, the name should no longer be editable, only the checkbox should be.
How exactly do I do this?
I had the idea to set the field "UserId" to .Editable(false) under .Model. But if I do that, I can neither change the value when creating nor when editing. When creating the entry, the drop-down menu for selecting an employee should be available, but not when editing.
In the attachments I have pictures showing the grid exactly.
Thanks in advance
Lars
@(Html.Kendo().Grid(Model)
.Name("AssignmentsGrid")
.Columns(c =>
{
c.ForeignKey(m => m.UserId, (IEnumerable) ViewData["users"], "Id", "Name").EditorTemplateName("ProjectUserDropdown");
c.Bound(m => m.Resigned).ClientTemplate("<input type='checkbox' #= Resigned ? checked='checked' :'' # disabled='disabled' />");
c.Command(command =>
{
command.Edit();
command.Destroy();
});
})
.ToolBar(t => t.Create())
.Events(events =>
{
events.Edit(@<text>function(e) { if(e.model.isNew()) { e.model.set('ProductionOrderId', @ViewData["productionOrderId"]); } else { $('[name="ProjectManagerId"]').attr("readonly", true); }} </text>);
})
.DataSource(s => s
.Ajax()
.Create(c => c.Action("UserAssignmentAdd", "ProductionOrder", new {area = "Sktcrm"}))
.Read(r => r.Action("UserAssignmentRead", "ProductionOrder", new {area = "Sktcrm"}).Data(@<text>function(e) { return { productionOrderId: @ViewData["productionOrderId"] }; }</text>))
.Update(u => u.Action("UserAssignmentUpdate", "ProductionOrder", new {area = "Sktcrm"}))
.Destroy(d => d.Action("UserAssignmentDelete", "ProductionOrder", new {area = "Sktcrm"}))
.Model(m =>
{
m.Id(model => model.UserId);
//m.Field(t => t.UserId).Editable(false);
})
.ServerOperation(false))
.Scrollable()
.Sortable()
.Filterable())
Eyup
Telerik team
answered
on
27 Jan 2023
0 answers
136 views
i am getting the error when i use @html.kendo()
it showing are you missing any directives
>please suggest any solution
dhruv
Top achievements
Rank 1
Rank 1
asked
on
12 Sep 2022
0 answers
70 views
I'm using EditorTemple to populate dropdown while in edit mode. I have my editor template in the Views/Shared/EditorTemplates folder.
But when I press the Edit button it does nothing and shows a simple text box instead of a dropdown.
I'm using dynamic properties for binding instead of the view model, all the references I've looked at are based on the view model.
Is there any way to accomplish the same with dynamic property binding?
Here's my code of Grid:
@(Html.Kendo().Grid<object>()
.Name("Grid")
.AutoBind(true)
//.Events(ev => ev.Filter("setGridFilters").DataBound("setAutoFitColumn"))
.Columns(columns =>
{
columns.AutoGenerate(true);
columns.Bound("status").Title("Lead Status").Width(100).EditorTemplateName("LeadStatusList")
.Filterable(a=>a.Multi(true).Search(true).BindTo(new[] {
new{
status="None"
},
new{
status="Initial Call Scheduled"
},
new{
status="Working"
},
new{
status="Nurturing"
},
new{
status="Unqualified"
},
new{
status="Qualified"
}
}));
columns.Bound("ownerId").Title("Owner").Width(100).Filterable(a => a.Multi(true).Search(true).DataSource(ds => ds.Custom()
.Type("aspnetmvc-ajax")
.Transport(transport =>
transport.Read(read => read.Action("", "", new { field = "ownerId" }))
)
.Schema(schema => schema
.Data("names")
)));
columns.Bound("eventBookedC").ClientTemplate("<div title='#= title #'>#:getEventStatus(eventBookedC) #</div>").Title("Event Booked").Width(70)
.Filterable(a => a.Multi(true).Search(true).BindTo(new[] {
new{
eventBookedC="Null"
},
new{
eventBookedC="True"
},
new{
eventBookedC="False"
}
}));
columns.Command(command => { command.Edit();}).Width(150);
})
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Sortable()
.Filterable()
.Scrollable(sc => sc.Endless(true))
.Groupable()
.Resizable(resize => resize.Columns(true))
.Reorderable(reorder => reorder.Columns(true))
.ToolBar(e =>
{
e.Search();
e.Custom().Text("Create New").HtmlAttributes(new { id = "btnCreateNew", @class = "btn btn-primary" });
})
.Pageable(p => p.Numeric(false).PreviousNext(false).Refresh(true))
.Events(events => events
.Sort("onSorting")
.Filter("onFiltering")
.Group("onGrouping")
.Page("onPaging")
.GroupCollapse("onGroupCollapse")
.GroupExpand("onGroupExpand")
.DataBound("onDataBound")
.ColumnReorder("onColumnReordering")
.Edit("edit")
)
.DataSource(dataSource => dataSource
.Custom()
.Type("aspnetmvc-ajax")
.PageSize(500)
.ServerPaging(true)
.ServerFiltering(true)
.ServerSorting(true)
.ServerGrouping(true)
.Transport(transport =>
{
transport.Read(read => read.Action("", ""));
transport.Update(update => update.Action("", ""));
}
)
.Schema(schema => schema
.Data("data")
.Total("total")
.Model(m=>m.Id("id"))
)
)
)Here's my editor template -> LeadStatusList.cshtml:
@using Kendo.Mvc.UI
@(Html.Kendo().DropDownList()
.Name("Status")
.DataTextField("Text")
.DataValueField("Value")
.BindTo(new List<SelectListItem>() {
new SelectListItem() {
Text = "None",
Value = "None"
},
new SelectListItem() {
Text = "Initial Call Scheduled",
Value = "Initial Call Scheduled"
},
new SelectListItem() {
Text = "Working",
Value = "Working"
},
new SelectListItem() {
Text = "Nurturing",
Value = "Nurturing"
},
new SelectListItem() {
Text = "Unqualified",
Value = "Unqualified"
},
new SelectListItem() {
Text = "Qualified",
Value = "Qualified"
}
})
.Value("1")
.HtmlAttributes(new { style = "width: 100%" })
)
Zack
Top achievements
Rank 1
Rank 1
asked
on
10 Jul 2022
0 answers
90 views
Hi everyone,
I'm in the process of developing an ASP.NET MVC application that should provide the ability to record the time worked by an employee with a chart.
I use the Telerik UI Scheduler for this. The integration and use in general works perfectly, but the EditorTemplate gives me problems. (see code)
As you can see, I'm trying to open data from a database in a DropDown using "ViewData" within the EditorTemplate. In the index function (ActionResult) in the controller I have declared the "ViewData", which gets the data from the database via a service.
Now the problem: If I want to use the "ViewData", the EditorTemplate can no longer be built. (See error in browser console -> pic in attachement)
If I use this ViewData in a PartialView it works without problems.
However, if I comment out this part in the controller (from "var projects..." to "...ToList();") and leave the EditorTemplate the same, everything works again and I can open the EditorTemplate via double-click on the scheduler. But I still can't get the data.
What do I have to do so that I can use the data from the "ViewData" in the EditorTemplate?
I hope someone can help me.
Controller: (TimeTrackingController.cs)
public async Task<ActionResult> Index() //TODO: ActionResult
{
// ignore this below ----------------------------------------------
var overview = new ActivityOverviewModel();
overview.PaList = new List<PA>
{
new PA
{
Id = 1,
Number = 201885445,
PaName = "Inbetriebnahme",
OrderNumber = 201745965,
OrderName = "Ein sehr schwieriger Auftrag",
ProjectNumber = 2019788458,
ProjectName = "Laser für Gießerei programmieren",
CompanyName = "Constellium Rolled Products",
PlannedHours = 70,
CurrentHours = 80,
PaLeft = false,
TechnicallyReady = true,
Favorite = false
},
new PA
{
Id = 1,
Number = 201888874,
PaName = "Lösungsfindung",
OrderNumber = 2197811144,
OrderName = "Ein sehr schwieriger zweiter Auftrag",
ProjectNumber = 2019788458,
ProjectName = "Laser für Eingang programmieren",
CompanyName = "S&K Anlagentechnik",
PlannedHours = 70,
CurrentHours = 45,
PaLeft = false,
TechnicallyReady = false,
Favorite = false
}
};
// ignore this above ----------------------------------------------
var projects = await _projectService.GetProjectsForTimelineCreateAsync();
ViewData["ActiveProjects"] = projects.Select(p => new TimelineCreateProjectModel
{
ProjectId = p.ProjectId,
ProjectInfo = $"{p.ProjectNumber} - {p.ProjectName}"
}).OrderByDescending(p => p.ProjectInfo).ToList();
return View(overview);
}
Index.cshtml:
<div id="right">
@(Html.Kendo().Scheduler<ActivityModel>()
.Name("ActivityScheduler")
.Editable(e => e.TemplateName("EditActivity"))
//.StartTime(new DateTime(2022, 01, 1, 5, 00, 00)) // scheduler starts at 5 am
.DataSource(d => d
.Read(r => r.Action("ActivityCalendarRead", "TimeTracking", new { area = "Sktcrm" }))
.ServerOperation(true))
.Views(v =>
{
v.DayView();
v.WeekView(view => view.Selected(true));
v.MonthView();
})
.Events(ev =>
{
ev.Edit("tripChanged");
ev.Add("tripChanged");
ev.DataBound("checkHolidays");
ev.DataBinding("navigate");
})
.Editable(e => e.Window(w => w.Title("Aktivität bearbeiten")))
)
</div>EditorTemplate: (EditActivity.cshtml)
<div>
@(Html.Kendo().DropDownList()
.Name("project")
/*.BindTo(new List<string>()
{
"Test ",
"Projekt 123",
"Leer",
"Test 2"
})*/
.ValuePrimitive(true)
.OptionLabel("Projekt wählen...")
.DataValueField("ProjectId")
.DataTextField("ProjectInfo")
.BindTo((IEnumerable) ViewData["ActiveProjects"]) // TODO: doesnt work!!!
.Filter(FilterType.Contains)
.HtmlAttributes(new {@class = "kendoSelectMain"}))
</div>
Thanks in advance
Lars
Lars1603
Top achievements
Rank 1
Iron
Rank 1
Iron
asked
on
28 Mar 2022
1 answer
1.7K+ views
im using trying to use a multiselect dropdownlist in my grid.. I'm getting error as Typeerror: cannot read property Text of null.
Grid:
@(Html.Kendo().Grid().Name("EmployeesGrid").Columns(columns => {
columns.Bound(e => e.FirstName).Title("First Name");
columns.Bound(e => e.LastName).Title("Last Name");
columns.Bound(e => e.CompanyId).EditorTemplateName("CompaniesList").Title("Company").ClientTemplate("#:CompanyName#");
columns.Command(command =>{
command.Edit();
}
);
}
).ToolBar(toolbar => toolbar.Create()).
Editable(editable => editable.Mode(GridEditMode.InLine)).
DataSource(dataSource => dataSource.Ajax().Events(events => events.Error("error_handler")).
Model(model => model.Id(e => e.Id)).
Create(update => update.Action("CreateEmployee","Home")).
Read(read => read.Action("ReadEmployees","Home")).
Update(update => update.Action("UpdateEmployees","Home"))))
After i select the values in the drop-down. im not able to see the values in the field... Need help with this
Petar
Telerik team
answered
on
18 Aug 2021
1 answer
622 views
Hi,
I am trying to use the same Dropdownlist in a parent grid, and its hierarchal/child grid. This Dropdownlist was written in jQuery and is kept inside the Shared/EditorTemplates folder and works as expected for the parent grid. However, when I apply it to columns on the child grid, it does not appear. It ignores the template and prompts me for an input like usual for inline editing instead of displaying the dropdownlist options.
Is it possible to use the same EditorTemplate inside of a hierarchy grid?
Patrick | Technical Support Engineer, Senior
Telerik team
answered
on
25 May 2021
1 answer
1.2K+ views
Hi,
I am creating a Kendo grid which involves using a Dropdown List for certain cells. I have created the Editor Template for the dropdown inside the Shared/EditorTemplates folder called DropdownList.cshtml. The dropdown list works as intended, I have inline editing enabled and I am able to update the values via Ajax.
Here's the column in the initial grid:columns.Bound(e => e.Balance).Width(40).Title("Balance").ClientTemplate("<span>#=getIcon(Balance)#</span>").EditorTemplateName("DropdownList");
The problem occurs when I try to use that same EditorTemplate called DropdownList in a hierarchy grid, just below its predecessor. The subgrid is configured using .ClientDetailTemplateId("template"), where the child grid is titled .Name("tracking-grid_#=id#"), and linked using .ToClientTemplate(). (As shown in the Telerik demonstration here.).
As soon as I add the .EditorTemplateName("DropdownList"); to the following line, the grid does not load and I receive the following error in the browser console: Uncaught Error: Invalid template
columns.Bound(e => e.Balance).Width(40).Title("Balance").ClientTemplate("<span>#=getIcon(Balance)#</span>").EditorTemplateName("DropdownList");
** Note: I know these columns have the same name, but they are being taken from different datasets. It just so happens to appear in both grids.
Searching for solutions, I made sure to try escaping all (#) hash characters with \\ wherever they appear, and I tried creating an alternate file in the EditorTemplates folder so they would be distinct. The grid still breaks and fails to render each time from just this one line.
I found a similar discussion here that I thought would help me, but no luck.
I understand that I am trying to use the same Editor Template in two separate grids. But I really need to use this dropdownlist in both. Is MVC not able to use the same editor template in nested grids like this, or is there something else I'm missing?
Thanks.
Patrick | Technical Support Engineer, Senior
Telerik team
answered
on
24 May 2021
