Is there any way to toggle tooltips for different tasks in the Gantt based on a field set in the model? We have some tasks that require tooltips, and I made a template for them that displays some model fields. When a top-level (i.e., summary) task does not contain children, I've added a task that displays No Tasks as its title (per user requirements). It is for these 'No Tasks' tasks that I would like to completely toggle off tooltips. Any suggestions?
So I've got a grid that I believe is all set up correctly. I've confirmed that the data is coming through, and I've even checked that the AJAX call returns a success with the "ToDataSourceResult" JSON data.
Unfortunately, the only problem is that the data doesn't display. This seems to only be an issue on read, as update, create and delete all work. Just can't retrieve the list of all items afterwards.
My controller action looks like this:
public IActionResult Blog_Read([DataSourceRequest] DataSourceRequest request)
{
var blogs = _blogService.GetPosts().Select(post => new BlogPostModel
{
Id = post.Id,
Title = post.Title,
Author = post.Author,
ShortDescription = post.ShortDescription,
Contents = post.Contents,
LastSaved = post.LastSaved,
Published = post.Published,
PublishedOn = post.PublishedOn
});
var result = blogs.ToDataSourceResult(request);
return Json(result);
}
And my Grid View looks like this:
@(Html.Kendo().Grid<BlogPostModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.Title);
columns.Bound(p => p.Author).Width(120);
columns.Bound(p => p.LastSaved).Width(120);
columns.Bound(p => p.Published).Width(120);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(250);
})
.ToolBar(toolbar => toolbar.Create())
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.Pageable()
.Sortable()
.Scrollable()
.HtmlAttributes(new { style= "height:600px;"})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Events(events => events.Error("error_handler"))
.Model(model => model.Id(p => p.Id))
.Create(update => update.Action("Blog_Create", "BlogAdmin"))
.Read(read => read.Action("Blog_Read", "BlogAdmin"))
.Update(update => update.Action("Blog_Update", "BlogAdmin"))
.Destroy(update => update.Action("Blog_Delete", "BlogAdmin"))
)
.Deferred()
)
The correct JSON is returned, no javascript errors in the console, so I'm a little confused as to what this could be. Any help would be greatly appreciated.
The View is rendered empty as if there is an exception when Editor is generated.
The DropDownList is not populated in the Editor.
If the Bind is commented in the Editor, the view is rendered and the Editor display the dropdownlist of course with no content.
So The problem comes from the Bind.
Any Help will be appreciated
My Model
public partial class TA_SITE_SIT
{
public TA_SITE_SIT()
{
TA_BUILDING_BUI = new HashSet<TA_BUILDING_BUI>();
}
[Key]
public Guid GUID_SIT { get; set; }
public string NAME_SIT { get; set; }
[InverseProperty("GUID_SITNavigation")]
public virtual ICollection<TA_BUILDING_BUI> TA_BUILDING_BUI { get; set; }
}
public partial class TA_BUILDING_BUI
{
[Key]
public Guid GUID_BUI { get; set; }
public Guid? GUID_SIT { get; set; }
public string NAME_BUI { get; set; }
[ForeignKey("GUID_SIT")]
[InverseProperty("TA_BUILDING_BUI")]
public virtual TA_SITE_SIT GUID_SITNavigation { get; set; }
}
My Controller
public async Task<IActionResult> Index()
{
ViewData["arSites"] = new SelectList(_context.TA_SITE_SIT, "GUID_SIT", "NAME_SIT");
return View(await _context.TA_BUILDING_BUI.ToListAsync());
}
My View
@(Html.Kendo().Grid<TA_BUILDING_BUI>(Model)
.Name("Buildings")
.Columns(columns =>
{
columns.Bound(model => model.NAME_BUI);
columns.Command(command =>
{
command.Edit();
});
})
.Editable(editable =>
{
editable.Mode(GridEditMode.PopUp);
editable.TemplateName("BuildingEditor");
})
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(m => m.GUID_BUI))
.Update(update => update.Action("Update", "Building"))
.Destroy(destroy => destroy.Action("Destroy", "Building"))
)
)
My Editor Template
@model TelAcces3.Models.TA_BUILDING_BUI
@(Html.Kendo().DropDownList()
.Name("DropDownList")
.DataTextField("NAME_SIT")
.DataValueField("GUID_SIT")
.BindTo(ViewBag.arSites)
)

Hello,
I have a problem with validation message for DatePicker in UI for ASP.NET MVC.
Property in model:
[DataType(DataType.Date, ErrorMessage = "Please enter a valid date. - TEST")]public DateTime FromDateTime { get; set; }Part of my cshtml file:
@(Html.Kendo().DatePickerFor(model => model.Filter.FromDateTime).Name("Filter.FromDateTime").Format(DateTimeFormats.DateTimeFormat).ParseFormats(DateTimeFormats.ParseFormat) .HtmlAttributes(new {@class = "form-control", style = "width: 100%"}))@Html.ValidationMessageFor(model => model.Filter.FromDateTime, "", new { @class = "text-danger" })This is part of the html page which is generated from the cshtml file:
<input name="Filter.FromDateTime" class="form-control k-input input-validation-error" id="Filter_FromDateTime" role="combobox" aria-disabled="false" aria-expanded="false" aria-invalid="true" aria-required="true" aria-describedby="Filter_FromDateTime-error" aria-owns="Filter_FromDateTime_dateview" style="width: 100%;" type="text" value="20. 4. 2016" data-val-required="Toto datum musà být vyplněno." data-val-date="The field FromDateTime must be a date." data-val="true" data-role="datepicker">Image of the part of the html page from webbrowser is in file "datepickerError.png".
The problem is in the content of the validation message. Message in my model is "Please enter a valid date. - TEST" but message in html is "The field FromDateTime must be a date."
I want to create localization of this message and change its content. How can I do it?
Thank you for your advice.
Hello.
I have the following DataTable (dataTable.JPG attached file), I want to generate a chart that looks similar to the attached file (Chart.png)
It has up to 3 levels of grouping as you can see in the chart, how can I accomplish this in charts for ASP.NET MVC?
Thank you.
Hi,
I'm having a problem with the aggregates on my server-bound grid. Here's my code:
@(Html.Kendo().Grid(Model[j].BusinessUnitTimesheets) .Name("BU_Time" + j) .DataSource(d => d .Server() .Aggregates(ag => { ag.Add(a => a.Amount).Sum(); ag.Add(a => a.Hours).Sum(); }) ) .Columns(columns => { columns.Bound(c => c.BusinessUnitId) .Hidden(); columns.Bound(c => c.BusinessUnitCodeAndName) .Title("Business Unit") .ClientFooterTemplate("Total"); columns.Bound(c => c.Hours) .Format("{0:N2}") .HtmlAttributes(new { style = "text-align:right;" }) .ClientFooterTemplate("#=sum#") .FooterHtmlAttributes(new { style = "text-align:right;" }); columns.Bound(c => c.Amount) .Width(100).Format("{0:N2}") .HtmlAttributes(new { style = "text-align:right;" }) .ClientFooterTemplate("#=kendo.toString(sum,'N2')#") .FooterHtmlAttributes(new { style = "text-align:right;" }); }) .DetailTemplate( @<text> @(Html.Kendo().Grid(item.UserTime) .Name(string.Format("BU_U_Time{0}_{1}", j, item.BusinessUnitId)) .DataSource(d => d .Server() .Aggregates(ag => { ag.Add(a => a.Hours).Sum(); ag.Add(a => a.Amount).Sum(); }) ) .Events(e => e.DataBinding("splitBound")) .Columns(columns => { columns.Bound(c => c.UserName) .Title("User"); columns.Bound(c => c.Hours) .Format("{0:N2}") .HtmlAttributes(new { style = "text-align:right;" }) .ClientFooterTemplate("#=sum#") .FooterHtmlAttributes(new { style = "text-align:right;" }); columns.Bound(c => c.Amount) .Width(100) .Format("{0:N2}") .HtmlAttributes(new { style = "text-align:right;" }) .ClientFooterTemplate("#=kendo.toString(sum,'N2')#") .FooterHtmlAttributes(new { style = "text-align:right;" }); }) ) </text> ))
I've attached a screenshot of the rendered grid. The totals are in the wrong columns for the parent grid, and both parent and child have sums that are zero.
Thanks
Hi, what am I doing wrong here? I can get the data out properly, but it won't sort. It seems to work the same in both MVC (razor) and in javascript.
It should have all the names (Resource) in alpha order... but it seems to be sorting by the PriorityColorString
MVC
@(Html.Kendo().Chart<Model>() .Name("Resources") .Title("Resource") .Legend(leg => leg.Visible(false)) .DataSource(ds => ds.Read( read => read.Action("GetAlertResources", "Hierarchy")) .Group(grp => { grp.Add(x => x.AlertTypeCount); } ).Sort(x => x.Add(srt => srt.Resource))) //) .ChartArea(chart => chart .Width(600).Height(600)) .SeriesDefaults(seriesDefaults => seriesDefaults .Bar().Gap(0) .Stack(true)) .Series(series => { series.Bar(x => x.AlertTypeCount) .Labels(lab => lab.Position(ChartBarLabelsPosition.Center).Opacity(0).Visible(true)) .Field("AlertTypeCount") .CategoryField("Resource") .ColorField("ColorField"); }) .CategoryAxis(ct => ct.MajorGridLines(maj => maj.Visible(false))) .Tooltip(tooltip => tooltip .Visible(true) .Template("<p style='width: 200px; text-align: left;'><span style='display: inline-block; font-weight: bold;'>Priority Color:</span> #= dataItem.ColorText #</p>" + "<p style='width: 200px; text-align: left;'><span style='display: inline-block; font-weight: bold;'>Resource:</span> #= dataItem.Resource #</p>" + "<p style='width: 200px; text-align: left;'><span style='display: inline-block; font-weight: bold;'>Number of Records:</span> #= value #") ))javascript:
var data = [{ AlertTypeCount:1,ColorField:"#D62728",ColorText:"1=High",PriorityColorString:"1",Resource:Albert },{ AlertTypeCount:6,ColorField:"#BCBD22",ColorText:"2=Medium",PriorityColorString:"2",Resource:Simon },{ AlertTypeCount:12,ColorField:"#FF7F0E",ColorText:"4=Other",PriorityColorString:"4",Resource:Theodore },{ AlertTypeCount:9,ColorField:"#BCBD22",ColorText:"3=Low",PriorityColorString:"3",Resource:Albert },{ AlertTypeCount:30,ColorField:"#D62728",ColorText:"1=High",PriorityColorString:"1",Resource:Albert },{ AlertTypeCount:10,ColorField:"#D62728",ColorText:"1=High",PriorityColorString:"1",Resource:Theodore },{ AlertTypeCount:3,ColorField:"#1F77B4",ColorText:"2=Low",PriorityColorString:"3",Resource:Simon },{ AlertTypeCount:1,ColorField:"#1F77B4",ColorText:"3=Low",PriorityColorString:"3",Resource:Pedro },{ AlertTypeCount:4,ColorField:"#BCBD22",ColorText:"2=Medium",PriorityColorString:"2",Resource:Marvin }]$("#chart").kendoChart({ dataSource: { transport: { read: { url: "/Hierarchy/GetAlertResources", dataType: "json" } }, group: [ { field: "AlertTypeCount" } ], sort: [ { field: "Resource", dir: "asc" }, ] }, chartArea: { width: 600, height: 600 }, title: { align: "left", text: "Resources" }, legend: { visible: false }, seriesDefaults: { type: "bar", gap: 0.1, stack: true }, series: [{ field: "PriorityColorString", categoryField: "Resource", colorField: "ColorField", labels: { visible: true, opacity: 0, position: "center" } }], categoryAxis: { majorGridLines: { visible: false } }, tooltip: { visible: true, template: "<p style='width: 200px; text-align: left;'><span style='display: inline-block; font-weight: bold;'>Priority Color:</span> #= dataItem.ColorText #</p>" + "<p style='width: 200px; text-align: left;'><span style='display: inline-block; font-weight: bold;'>Resource:</span> #= dataItem.Resource #</p>" + "<p style='width: 200px; text-align: left;'><span style='display: inline-block; font-weight: bold;'>Number of Records:</span> #= value #" } });Hello,
We are currently developing with the Diagram control.
I have a question, how do we customize the ribbon's toolbar above it? (see screenshot)
I am reading conflicting tutorials about this, some say it is a WIDGET, but then i read toolbar in some places.
Is there an example somewhere how to, for example add a button with an customized onclick?
Gr from John
Hello!I have a problem, where I try to insert color picker in grid
.CSHTML:
@(Html.Kendo().Grid(Model)
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.Id).Title(Resources.Resource.Id);
columns.Bound(p => p.Name).Title(Resources.Resource.Name);
columns.Bound(p => p.Text).Title(Resources.Resource.Text);
columns.Bound(p => p.Color).Title(Resources.Resource.Color)
.ClientTemplate("<div style='background-color: #: Color#;padding:10px; border: 1px solid black;'></div>")
.EditorTemplateName("Color");
columns.Bound(p => p.Description).Title(Resources.Resource.Description);
columns.Command(command => { command.Edit(); });
})
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Pageable()
.Sortable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Events(events => events.Error("error_handler"))
.Model(model =>
{
model.Id(m => m.Id);
model.Field(m => m.Id).Editable(false);
model.Field(m => m.Name).Editable(false);
})
.Read(read => read.Action("Read", "OrderStatus"))
.Update(update => update.Action("Update", "OrderStatus"))
)
)
Color Editor Template:
@model string
@(Html.Kendo().ColorPickerFor(
m => m))
As a result i get any nonsence (1.jpg)
I want to get this(2.png)
Please, help me.