Hello,
We are trying to get the Gantt to display just a selected date range for tasks and subtasks, without the ability to scroll forward or backwards past those explicit dates. I am altering start and end dates for tasks that start before or end after the designated date ranges so they do not go outside of the time period we want to display. This works well on the start side of the timeline, however, the end of the time line always displays more time periods.
An example. Selected date range is 1/1/2016 --> 12/31/2017, using Year view. All tasks start at or after the selected start (any task that starts before the 1/1/2016 date is altered to start on 1/1/2016), and all tasks are updated to end at or before the selected end date. Gantt time line starts correctly at 1/1/2016 and does not allow scrolling prior to that date. All tasks/subtasks end (or were altered to end) before the end date, but the timeline scrolls for another whole year through 12/31/2018. Is there any way to force the timeline to end at a specified date?
Let me know if you need further clarification, and thank you.
Hi
I have the menu below which is dynamically created from the database. It shows Category and their respective SubCategories. I also have the url that it needs to navigate to stored in the database. How can I load the relevant url when the user clicks on a menu item?
The code for my menu is:
@(Html.Kendo().Menu()
.Name("Menu")
.BindTo(Model.categories, mappings =>
{
mappings.For<PhytClean.Models.DB.Category>(
binding => binding.ItemDataBound((item, category) =>
{
item.Text = category.CategoryName;
}).Children(category => category.SubCategories)
);
mappings.For<PhytClean.Models.DB.SubCategory>(binding => binding.ItemDataBound((item, subCategory) =>
{
item.Text = subCategory.SubCategoryName;
}));
})
)
I tried using the following to see if it would get me the URL field from that database entity but it returns "undefined"
<script type="text/javascript">
$(function () {
$("#Menu").kendoMenu({
select: function (e) {
var url = $(e.item).find(".k-link").attr("URL");
}
});
});
</script>
Any assistance would be appreciated.
Thanks

Hello,
Hopefully, this is an easy question. Basically, I don't want the gray box with the circle with an x and the item text to appear when the user drags it onto an area. I got the circle with an x with to disappear using CSS; I just need the CSS classes/ids for the other pieces, so I can make them disappear.
Thanks!
Hello,
When using the select event handler, I need to capture the id of the item that was clicked on, allow the user to click on a spot on the canvas (a different vendor's tool), and then draw the shape that the user chose at that location. Getting the id of the item is fine and the correct shape is drawn on the canvas. However, this happens when the item in the tree view is selected instead of when the user clicks on the canvas. I attached an event listener to the canvas using getElementById, but listener is triggered when the tree view item is selected and I'm not sure how to ensure that it only fires after the user clicks on the canvas.
function onSelect(e) { // this refers to the TreeView object var dataItem = this.dataItem(e.node); document.getElementById("canvas").addEventListener("click", drawShape(dataItem.id), false);}function drawShape(shape){ var x = event.clientX; var y = event.clientY; //draw correct shape at target location}
Any suggestions?
Thanks in advance.
Hi guys lately i have been trying to add upload control inside a popup window but i same as i have my custom edit template. The idea is to have another popup window where I will only handle the uploading of images in a separate window and that window i would like it to have a grid to show uploaded images.
Here is my grid code with the custom edit template for editing,
@(Html.Kendo().Grid<KendoUIApp1_Test.Models.IncidentsViewModel>() .Name("grid") .Columns(colums => { */ colums.Bound(p => p.DepartmentID).Hidden(true); colums.Bound(p => p.StatusName).Title("Status").Filterable(false).ClientTemplate( "# if (StatusID === 1 ) { #" + "<span class='CBdrawingstatusGreen'>#:StatusName#</span>" + "# } else if (StatusID === 2 ) { #" + "<span class='CBdrawingstatusYellow'>#:StatusName#</span>" + "# } else { #" + "<span class='CBdrawingstatusred'>#:StatusName#</span>" + "# } #" ); colums.Bound(p => p.ReferenceNo).Title("ReferenceNo").Filterable(true); colums.Bound(p => p.IncidentDate).Title("IncidentDate").ClientTemplate("#= kendo.format('{0:MM/dd/yyyy HH:mm:ss}',kendo.parseDate(IncidentDate)) #"); //.Filterable(model => model.UI("IncidentDateFilter")); colums.Bound(p => p.AccountName).Title("Airport").Filterable(false).Width(200); colums.Bound(p => p.SiteName).Title("Site").Filterable(false); colums.Bound(p => p.Department1).Title("Department").Filterable(false); colums.Bound(p => p.Description).Title("Description").Filterable(false); colums.Bound(p => p.Comments).Title("Comments").Filterable(false); colums.Bound(p => p.ContactName).Title("CurrentAssignedContact").Filterable(false).Width(200); colums.Bound(p => p.FirstName).Title("CurrentAssignedUser").Filterable(false); colums.Bound(p => p.IncidentID).ClientTemplate("<a class='k-button' href='" + Url.Action("GetPDF", "Home") + "?IncidentID=#= IncidentID #'" + "> <span span class='k-icon k-i-pdf''></span>Get Incident Pdf</a>").Title("Download PDF").Filterable(false); colums.Command(cmd => { cmd.Edit(); //cmd.Custom("Upload").Click("onCustomCommandClick"); }); }) .Filterable(filterable => filterable .Extra(true) .Operators(operators => operators .ForString(str => str.Clear() .StartsWith("Starts with") .IsEqualTo("Is equal to") .IsNotEqualTo("Is not equal to") )) ) .HtmlAttributes(new { style = "height:550px;" }) .DataSource(datasource => datasource .Ajax() //Configure the grid data source .Events(Eevents => Eevents.RequestEnd("OnChangeRefresh")) .Model(model => { model.Id(m => m.IncidentID); }) .Read(read => { read.Action("GetIncidents", "Home").Data("IncidentsFilter"); })// set the action method which will return the data in json format .Update(update => update.Action("Incidents_Update", "Home")) ) .Navigatable() .Groupable() .Pageable() .Reorderable(reorder => reorder.Columns(true)) .Sortable() .Scrollable() .Events(events => { events.Save("onIncidentUserAssign"); // events.Save("onStatusChange"); }) .Events(eEvents => eEvents.Edit("disableOnEdit")) .Events(x => x.DataBound("onDataBound")) //.Events(events => //{ // events.Save("onStatusChange"); // // events.Save("onStatusChange"); //}) .Editable(ed => ed.Mode(GridEditMode.PopUp).TemplateName("Incidents") .Window(w => w.Animation(true) .Scrollable(false) .Name("editWindow"))) ) and below my edit template,
@Html.HiddenFor(model => model.AccountID)
@Html.HiddenFor(model => model.StatusID)
@Html.HiddenFor(model => model.CurrentAssignedUser)
@Html.HiddenFor(model => model.CurrentAssignedContact)
@Html.HiddenFor(model => model.DepartmentID)
@Html.HiddenFor(model => model.OriginalAssignedUser)
@Html.HiddenFor(model => model.SiteID)
<div class="container">
<div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
<div class="form-horizontal">
<div class="panel panel-primary">
<div class="panel-heading">Incident Settings</div>
<div class="panel-body">
<div class="form-group">
<table class="table.art-article">
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.ReferenceNo, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().TextBoxFor(model => model.ReferenceNo).Enable(false)
.HtmlAttributes(new { style = "width:200px" })
)
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.Status, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().DropDownListFor(model => model.StatusName)
.Name("KStatus")
.DataTextField("StatusName")
.DataValueField("StatusID")
.OptionLabel("Select Status")
.HtmlAttributes(new { style = "width:200px" })
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetStatus", "Home");
})
.ServerFiltering(true);
})
.AutoBind(false)
)
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.IncidentDate, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().DateTimePickerFor(model => model.IncidentDate)
.HtmlAttributes(new { style = "width:200px" })
)
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.CurrentAssignedUser, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().TextBoxFor(model => model.FirstName).Enable(false)
.HtmlAttributes(new { style = "width:200px" })
)
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.CurrentAssignedContact, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().TextBoxFor(model => model.ContactName).Enable(false)
.HtmlAttributes(new { style = "width:200px" })
)
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.NewDepartment, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().DropDownListFor(model => model.Department1)
.Name("KDept")
.DataTextField("Department1")
.DataValueField("DepartmentID")
.OptionLabel("Select Department")
.HtmlAttributes(new { style = "width:200px" })
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetDepartments", "Home");
})
.ServerFiltering(true);
})
.Events(e => { e.Change("OnChange"); })
.AutoBind(false)
)
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.AssignNewUser, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().DropDownListFor(model => model.FirstName)
.Name("Knames")
.DataTextField("FirstName")
.DataValueField("UserID")
.OptionLabel("Select A User")
.HtmlAttributes(new { style = "width:200px" })
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetUsers", "Home");
});
})
)
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.AssignNewContact, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().DropDownListFor(model => model.ContactName)
.Name("KContact")
.DataTextField("ContactName")
.DataValueField("ContactID")
.OptionLabel("Select A Contact")
.HtmlAttributes(new { style = "width:200px" })
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetContact", "Home");
});
})
)
</div>
</td>
</tr>
@* uploading of files images *@
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.AssignNewContact, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
<div id="Popdiv" style="display: none">
@(Html.Kendo().Upload()
.Name("file")
.Multiple(false)
.Events(x => x.Success("onSuccess"))
)
<div style="float: right; margin: 10px">
<button id="okayButton" >Okay</button>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.currentDepartment, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
<div class="k-edit-field">
@(Html.Kendo().TextBoxFor(model => model.Department1).Enable(false)
.HtmlAttributes(new { style = "width:200px" })
)
</div>
</td>
</tr>
<tr>
<td>
<div class="k-edit-label">
@Html.LabelFor(model => model.Comments, new { @class = " col-xs-3 col-sm-3 col-md-3 col-lg-3 control-label " })
</div>
</td>
<td>
@* <span class="k-textbox k-space-right">*@
<div class="editor-field textarea">
@* @(Html.Kendo().TextBoxFor(model => model.Comments)
.HtmlAttributes(new { style = "width:200px" })
)*@
@Html.TextAreaFor(model => model.Comments, new { rows = "6", cols = "45", @class = "form-control" })
@*@Html.Bootstrap().TextAreaFor(model => model.Comments).Rows(6).Columns(28)*@
</div>
@*</span>*@
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
Please help guys...
We have a simple Gantt chart, no dependencies, and are displaying tasks and subtasks. I am able to color subtask bars using a custom template, but have not been able to do anything with the summary bar. Each task and subtask needs to be colored according based on it's status, and I m storing the color in an added field in my IGanttTask class. If I remove the top-level tasks' Summary designation (i.e., Summary = false), I lose treelist functionality.
Any help and assistance is much appreciated. Let me know if you need further information.

Did anyone knows how to localize the caption of the edit dialog when using GridEditMode.PopUp ?
I have found how o localize the button
columns.Command(commands =>
{
commands.Edit().Text(@Localizer["idsEdit"].Value)
.UpdateText(@Localizer["idsOK"].Value)
.CancelText(@Localizer["idsCancel"].Value); // The "edit" command will edit and update data items.
commands.Destroy().Text(@Localizer["idsDelete"].Value); // The "destroy" command removes data items.
}).Title(@Localizer["idsCommands"].Value).Width(220);
but not the caption.
Any ideas ?
Best regards

Good Afternoon,
Not sure why this is happening but hope somebody can help.
I need to add tabs dynamically which works ok but once they are added I can see it's content in the tabs that already existed. It's definitely the new tab's content as when I change the options in one tab, the changes are reflected in the other tabs. My code is below and I have attached some screenshots also. I would be really grateful for any assistance.
<button type="button" class="btn btn-success" id="myButton">Add New Job</button>
<p></p>
@(Html.Kendo().TabStrip()
.Name("tabstrip")
.Items(tabstrip =>
{
tabstrip.Add().Text("1: BAIC13 ")
.Selected(true)
.LoadContentFrom(Url.Action("Job1", "Test"));
tabstrip.Add().Text("OPERATORS")
.LoadContentFrom(Url.Action("Operators", "Test"));
})
)
</div>
<script>
$(document).ready(function () {
$("#myButton").click(function () {
var tabStrip = $("#tabstrip").kendoTabStrip().data("kendoTabStrip");
var lastIndex = tabStrip.tabGroup.children("li:last").index();
tabStrip.insertBefore(
{
text: "New Tab",
contentUrl: '@Url.Action("AddJob", "Test")'
},
tabStrip.tabGroup.children("li:last")
);
tabStrip.select(lastIndex);
});
});
</script>