Model for the Tag property is of complex type object
[UIHint("TaskTagEditor")]
public List<NameId> TaskTags { get; set; }
// Class ----
public class NameId
{
public int Id { get; set; }
public string Name { get; set; }
}
Kendo grid field:
columns.Bound(p => p.TaskTags).Width(240).ClientTemplate("#=taskTagsTemplate(TaskTags)#").EditorTemplateName("TaskTagEditor").Title("Tasks") .Filterable(p => p.Multi(true) .CheckAll(false) .ItemTemplate("TaskTagsFilterItemTemplate") .DataSource(d => { d.Read(read => read.Action("GetTaskTagsEditor", "TaskManager")); }) );
Client Template and Item template js:
function taskTagsTemplate(data) {
var template = "";
for (var i = 0; i < data.length; i++) {
template += (data.length == 1 || i == 0) ? data[i].Name : ("," + data[i].Name);
}
return template;
}
function TaskTagsFilterItemTemplate(e) {
return "<span><label><input class='tag-filter-input' type='checkbox' name='" + e.field + "' value='#= Id #'/><span>#= Name #</span></label></span><br/>"
}
Editor :
GetTaskTagsEditor
@model List<GrapeTree.Core.Model.TaskManager.NameId>
@(Html.Kendo().MultiSelectFor(m => m)
.DataTextField("Name")
.DataValueField("Id")
.AutoBind(false)
.TagMode(MultiSelectTagMode.Multiple)
.DataSource(d =>
{
d.Read(read => read.Action("GetTaskTagsEditor", "TaskManager"));
})
)
Controller method for option:
public ActionResult GetTaskTagsEditor() {
var tagList = _taskManager.GetActiveTaskTags()
.Select(tag => new NameId
{
Id = tag.Id,
Name = tag.Name
}).OrderBy(x => x.Name);
var jsonSerializerSettings = new JsonSerializerSettings { ContractResolver = new DefaultContractResolver() };
var json = JsonConvert.SerializeObject(tagList.ToList(), Formatting.Indented, jsonSerializerSettings);
return Content(json, "application/json");
}
Incell Editor is working fine and Filter about to bind with muti select value but filtering doesn't work for this complex object
Hi ,
We have a validation related requirement on the datepicker control. The datepicker control should not allow alphabets or special chars to be keyed in. It should allow only numerics, backspace and forward slaces keys for example: 10/10/2022.
The requirement is to validate it as soon as its keyed in instead of when the control lose focus.
Because datepicker control does not have keydown/key press event, I added a jquery script as below and it works fine but we dont want to repeat the script for all the date pickers controls on different screens across the project. Is there any feature of the control it self that can be used everywhere??
Thanks,
Chhavi
I have a grid that I want to be an Ajax grid (not Server) but I need to render one of the cells using ASP.NET MVC partials. Looks somewhat like this:
@(Html.Kendo().Grid(Model.Items)
.Name("items")
.Columns(columns =>
{
columns.Bound(p => p.Payload).Template(@<text>
@Html.Partial(item.ItemUI, item.Payload)
</text>).ClientTemplate("@output");
})
.DataSource(dataSource => dataSource
.Ajax()
)
)
Is that possible to instruct Kendo to output the result of a call to Template() in ClientTemplate()? In the example above, is there some magic keyword I can use instead of the highlighted @output to say "output whatever was generated on the server side here?"
Thanks
I have a partial MVC view called _user.cshtml that displays some basic information about a user:
@model UserVM
<p>
<span>Name: </span>@Model.Name
<span>Email: </span>@Model.Email
</p>
In the parent view I have an MVC Kendo Grid:
@model ImportUsersVM
@(Html.Kendo().Grid(Model.Items)
.Name("ImportUsers")
.Columns(columns =>
{
columns.Bound(i => i.Status);
columns.Template(i => Html.RenderPartial("_user", i.Payload));
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(100)
.ServerOperation(false)
)
)
The highlighted line above doesn't work -- the user information is not rendered.
How can I include an MVC partial on each row of the grid?
Thank you
I have a grid that has a column that should only be shown if a user selects an option on the view (default is set to hidden).
Is there a standard way to toggle the visibility of a column dynamically via javascript?
Problem discovered....now I need some help fixing
I added Telerik to a project of mine today and everything looked fine. My project uses IdentityManagerUI and I use Datatables to display the Roles and Users for adding editing, etc.
I went to check a role and DataTables through up a cryptic error "DataTables warning: table id=usersTable - Requested unknown parameter 'id' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4.
I take Telerik back out of the project and everything is fine. Add it back in and I get the same error.
I am currently working in an MVC Core .NET 6 environment using EF6 and all that. I have looked everywhere to see what has changed and I can't find anything. I've stripped down the view to not include js or css from wwwroot or layouts, making sure I'm only using the Kendo references and I still have the problem
Anyone ever have this problem or have an idea of where I should look to see what's going on?
Thanks!!
I have a scheduler that I've created in MVC and reset the data with via javascript
@(Html.Kendo().Scheduler<MyProject.Models.Schedule.Kendo.ISchedulerData>()
.Name("edit-scheduler")
.Date((DateTime)MyProject.Helper.Date.StringToDateTime(ViewBag.EventHeader.StartDate.ToString("MM/dd/yyyy")))
.StartTime((DateTime)MyProject.Helper.Date.StringToDateTime(ViewBag.EventHeader.StartDate.ToString("MM/dd/yyyy")))
.EndTime((DateTime)MyProject.Helper.Date.StringToDateTime(ViewBag.EventHeader.EndDate.ToString("MM/dd/yyyy")))
.EventTemplate(
"#=eventTemplate(SupplierNumber,SupplierName, MeridiemDeliveryTime, OrdersReadable, OrderGroup1,OrderGroup2,OrderGroup3,OrderGroup4,OrderGroup5,OrderGroup6,OrderGroup7,OrderGroup8,IsEvent,Color)#"
)
.Views(views =>
{
views.MonthView(month =>
{
month.Selected(true);
month.EventsPerDay(20);
month.AdaptiveSlotHeight(true);
month.EventHeight("auto");
month.EventSpacing(5);
});
})
.Timezone("EST")
.Editable(true)
.Editable(editable => editable.Confirmation(false))
.Resources(resource =>
{
resource.Add(m => m.ActiveSupplierNumber)
.Title("Owner")
.DataTextField("Text")
.DataValueField("Value")
.DataColorField("Color")
.BindTo(ViewBag.Colors);
})
.DataSource(d => d
.Read(read => read.Action("GetStoreSchedule", "ScheduleData").Data("scheduler_Data"))
)
.Events(e =>
{
e.Remove("scheduler_Remove");
e.Edit("scheduler_Edit");
e.MoveEnd("scheduler_MoveEnd");
e.MoveStart("scheduler_MoveStart");
e.ResizeStart("scheduler_ResizeEnd");
e.DataBound("scheduler_DataBound");
})
)
With my scheduler_Data() like this
var _eventHeaderId = 1;
var _stageId = '0B579CE9-2CB8-4ACF-9EC1-892378632823'; // This changes frequently
function scheduler_Data() {
var store = $("#edit-store-dropdown").data("kendoDropDownList").value();
var supplier = $("#edit-supplier-dropdown").data("kendoDropDownList").value();
var sdata = {};
sdata["eventHeaderId"] = parseInt(_eventHeaderId);
sdata["stageId"] = _stageId;
sdata["store"] = parseInt(store);
sdata["supplier"] = parseInt(supplier);
return sdata;
}
The first time the page loads, there is no store, the controller does not return data, the scheduler remains blank (exactly as expected)
As I do other things on the page, the store dropdown has a value, and I run some code that updates the _stageId and does some database work, then it refreshes the scheduler, which basically is just me doing this.
scheduler.dataSource.read(); scheduler.refresh();
This all works perfectly. My scheduler populates from the database. However, if I click into a day (triggering scheduler_Edit) - it creates the event offset by one day, if there is at least 3 other events in the previous day. So if Sunday has 3 events, and I click Monday, it adds the event to Sunday. If I have 2 events on Sunday and click Monday, it adds the event to Monday
So I put some code into scheduler_Edit()
console.log("You clicked " + e.event.start);
If I cancel my custom edit window, and click in the same place on scheduler it populates exactly where it should
And the console bears that out
And from that point, it adds to the correct day until I redo the refresh scheduler code
scheduler.dataSource.read(); scheduler.refresh();
Then it happens again?
Am I doing something weirdly wrong?
Hello everyone,
I have a clientfootertemplate in a subcolumn and I want to show something in my column but when I do this the colspan is 3 instead of 1 so instead of 1 column he takes 3 columns.
Can someone help me with this?
I want to do something like what happens at http://demos.telerik.com/aspnet-mvc/treeview/checkboxes, where when you click a node, its parent nodes light up but are not checked. I've looked at the demo and can't figure out how to make this happen. Any ideas would be helpful.
It's the end of the day on Friday, so I don't really have time right now to come up with samples of my code. If no one has an idea by Monday, I will do that.
Thanks!
Laurie