Hello,
I have a Scheduler Resources and i must show in cascade showing with 4 column
Example
|Name|Type|Status|Active|Days|
|A | T | T | 1 | Days|
|B | T | K | 0 | Days|
but i cant find how to do this. All examples show included resources not connected others.
I have follow Kendo UI for ASP.NET MVC Local binding example to create my pivot view.
At my pivot grid, the rows is group by a date, however, the date display on the row header is a long date format. How to format a date in a row header column to a short date?
At the following code, I am able to use the template to format a date field to a short the format, but not on the row header column. please see the picture for the detail.
@model IEnumerable<
TelerikMVCStudy.Domain.Dailyforecast_view
>
@{
ViewBag.Title = "Index";
}
<
h2
>Pivot</
h2
>
@(Html.Kendo().PivotConfigurator()
.Name("configurator")
.HtmlAttributes( new { @class = "hidden-on-narrow"})
.Height(570)
)
@(Html.Kendo().PivotGrid<
TelerikMVCStudy.Domain.Dailyforecast_view
>()
.Name("pivotgrid")
.HtmlAttributes(new { @class = "hidden-on-narrow" })
.Configurator("#configurator")
.Height(579)
.BindTo(Model)
.DataCellTemplateId("dataCellTemplate")
.ColumnHeaderTemplateId("headerTemplate")
.RowHeaderTemplateId("rowHeaderTemplate")
.DataSource(dataSource => dataSource
.Ajax()
.Schema(schema => schema
.Model(m => m.Field("Utility", typeof(string)).From("Utility"))
.Cube(cube => cube
.Dimensions(dimensions =>
{
dimensions.Add(model => model.Portfolio).Caption("Portfolio");
dimensions.Add(model => model.Utility).Caption("All Utility");
dimensions.Add(model => model.CalendarDate.ToShortDateString()).Caption("CalendarDate");
})
.Measures(measures =>
{
measures.Add("sum").Format("{0:N4}").Field(model => model.MMBtu).AggregateName("sum");
measures.Add("max").Field(model => model.CalendarDate).AggregateName("max");
})
)
)
.Columns(columns =>
{
columns.Add("Utility").Expand(true);
})
.Rows(rows => rows.Add("CalendarDate").Expand(true))
.Measures(measures => measures.Values("sum"))
.Events(e => e.Error("onError"))
)
)
<
script
>
function onError(e) {
alert("error: " + kendo.stringify(e.errors[0]));
}
</
script
>
<
script
id
=
"dataCellTemplate"
type
=
"text/x-kendo-tmpl"
>
# var columnMember = columnTuple ? columnTuple.members[0] : { children: [] }; #
# var rowMember = rowTuple ? rowTuple.members[0] : { children: [] }; #
# var value = (dataItem.value instanceof Date) ? kendo.toString(dataItem.value,"d") : kendo.toString(kendo.parseFloat(dataItem.value) ||"N/A", "N4"); #
# if (columnMember.children.length || rowMember.children.length) { #
<
em
style
=
"color: red"
>#: value # (total)</
em
>
# } else { #
#: value #
# } #
</
script
>
<
script
id
=
"headerTemplate"
type
=
"text/x-kendo-tmpl"
>
# if (!member.children.length) { #
<
em
>#: member.caption #</
em
>
# } else { #
#: member.caption #
# } #
</
script
>
<
script
id
=
"rowHeaderTemplate"
type
=
"text/x-kendo-tmpl"
>
# if (!member.children.length) { #
<
em
>#: member.caption #</
em
>
# } else { #
#: member.caption #
# } #
</
script
>
<
style
>
#pivotgrid
{
display: inline-block;
vertical-align: top;
width: 70%;
}
#configurator
{
display: inline-block;
vertical-align: top;
}
.hidden-on-narrow {
display: inline-block;
vertical-align: top;
}
</
style
>
Hello,
I have a problem. I have three Kendo components that have the same code, but only one of them is clickable.
Here is the code :
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.Collections.Generic.List<System.Collections.Generic.List<IntranetMVC.Models.Vehicule>>>" %>
<script src="<%= Url.Content("~/Scripts/Entrees_Sorties/VehiculesEnAttente.js") %>" type="text/javascript"></script>
<!-- Description : Vue partielle affichant la grille des vehicules attendus sur le site -->
<br />
<div class="tabKendo" style="text-align:center">
<!-- GRILLES DE DONNES -->
<table style="font-size:80%; border-collapse : collapse; border-spacing : 2px; ">
<tr>
<td>
<h3>Hier</h3>
</td>
<td>
<h3>Aujourd'hui</h3>
</td>
<td>
<h3>Demain</h3>
</td>
</tr>
<tr>
<td>
<!-- ----------- GRILLE POUR LES VEHICULES D'HIER ---------->
<% Html.Kendo()
.Grid<IntranetMVC.Models.Vehicule>()
.Name("Gd_Hier")
.BindTo(Model[0])
.Events(e => e
.Change("OnVehiculeArrive_va"))
.Columns(columns =>
{
columns.Bound(c => c.sHeurePrevue).Width(50).Title("Heure");
columns.Bound(c => c.NomTransporteurPrevu)
.Width(100)
.ClientTemplate("#= data.NomTransporteur.substring(0,14) #")
.Title("Transporteur");
})
.HtmlAttributes(new { style = "height: 464px; width: 180px; margin:5px; font-size:130%" })
.Sortable()
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Single))
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.Sort(sort => sort.Add("sHeurePrevue").Ascending()))
.Render();
%>
</td>
<td>
<!-- ----------- GRILLE POUR LES VEHICULES DE TODAY ---------->
<% Html.Kendo()
.Grid<IntranetMVC.Models.Vehicule>()
.Name("Gd_Today")
.BindTo(Model[1])
.Events(e => e
.Change("OnVehiculeArrive_va"))
.Columns(columns =>
{
columns.Bound(c => c.sHeurePrevue).Width(50).Title("Heure");
columns.Bound(c => c.NomTransporteurPrevu)
.Width(100)
.ClientTemplate("#= data.NomTransporteur.substring(0,14) #")
.Title("Transporteur");
})
.HtmlAttributes(new { style = "height: 464px; width: 180px; margin:5px; font-size:130%" })
.Sortable()
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Single))
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.Sort(sort => sort.Add("sHeurePrevue").Ascending()))
.Render();
%>
</td>
<td>
<!-- ----------- GRILLE POUR LES VEHICULES DE DEMAIN ---------->
<% Html.Kendo()
.Grid<IntranetMVC.Models.Vehicule>()
.Name("Gd_Demain")
.BindTo(Model[2])
.Events(e => e
.Change("OnVehiculeArrive_va"))
.Columns(columns =>
{
columns.Bound(c => c.sHeurePrevue).Width(50).Title("Heure");
columns.Bound(c => c.NomTransporteurPrevu)
.ClientTemplate("#= data.NomTransporteur.substring(0,14) #")
.Width(100)
.Title("Transporteur");
})
.HtmlAttributes(new { style = "height: 464px; width: 180px; margin:5px; font-size:130%" })
.Sortable()
.Selectable(selectable => selectable
.Mode(GridSelectionMode.Single))
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.Sort(sort => sort.Add("sHeurePrevue").Ascending()))
.Render();
%>
</td>
</tr>
</table>
</div>
I don't have any idea why, but only the first component is clickable (the one under "hier" on the screenshot I joined).
Hi,
I'm trying to create a dropdown into a gridview, and I have tried lots op things.
the thing I'm stuck with now is this error
"The call is ambiguous between the following methods or properties: 'Kendo.Mvc.UI.Fluent.DropDownListBuilder.BindTo(System.Collections.Generic.IEnumerable<Kendo.Mvc.UI.DropDownListItem>)' and 'Kendo.Mvc.UI.Fluent.DropDownListBuilder.BindTo(System.Collections.Generic.IEnumerable<System.Web.Mvc.SelectListItem>)'"
in the Bindto I have a list of items which I load from the viewbag.
But I can't get pass this error.
do U need to unreference something?
thank you.
I'm using telerik grid popup edit mode. when error occurs I want to prevent closing editor.
Here is the code; it works fine
var grid = $("#popupGrid").data("kendoGrid");
But I want to call dynamically find the grid.
I found the below the code. But It's not working:
<
p
>var gridId = e.sender.options.table.parent('div')[0].id;<
br
> var grid = $("#" + gridId).data("kendoGrid");</
p
><
p
></
p
>
e.sender.options.table =null.
how can I do this?
Hello,
I have a grid with a colorpicker, when i choose the color from the palette I have the hex color code displayed instead of the color.
here is my TemplateEditor that i called QTPStatusEditor:
@model string
@(Html.Kendo().ColorPickerFor(m=>m)
.Name("Status")
.Palette(new[] { "rgba(255, 255, 255, 1)", "rgba(0, 204, 0, 1)", "rgba(255, 51, 51, 1)", "rgba(255, 201, 14, 1)" })
.Columns(4)
)
And here is My Grid:
@(Html.Kendo().Grid<
Volvo.Qarma.MVCWebUIComponent.Models.Views.ProposedQToolViewModel
>()
.Name("QTPGridItems_#=Id#")
.ToolBar(toolbar => toolbar.Template(@<
text
>
<
div
class
=
"toolbar"
>
<
input
type
=
"button"
id
=
"SaveProposedQTools"
class
=
"icon save k-grid-save-changes"
value
=
"@ScreeningResource.Screening_TreatmentPlan_SaveProposedQTools"
/>
</
div
>
</
text
>))
.Columns(columns =>
{
columns.Bound(o => o.RefQTool.Name).Title("Pro-active actions");
columns.Bound(o => o.Responsable).Title("Responsible");
columns.Bound(o => o.QtoolLeader).Title("Qtool Leader");
columns.Bound(o => o.Location.LongName).EditorTemplateName("LocationListEditor").Title("Location");
columns.Bound(o => o.Status).EditorTemplateName("QTPStatusEditor").Title("Status");
columns.Bound(o => o.PlannedStartDate).EditorTemplateName("PlannedStartDateEditor").Title("Planned start date").Format("{0:dd/MM/yyyy}");
columns.Bound(o => o.PlannedEndDate).EditorTemplateName("PlannedEndDateEditor").Title("Planned End date").Format("{0:dd/MM/yyyy}");
columns.Bound(o => o.LastUpdateDate).EditorTemplateName("LastUpdateDateEditor").Title("Last Update Date").Format("{0:dd/MM/yyyy}");
columns.Bound(o => o.LinkToDocument).Title("Link To Document");
columns.Bound(o => o.Comment).Title("Comment");
})
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.ServerOperation(false)
.PageSize(10)
.Read(read => read.Action("QtpGridSelectedQtools", "QTP", new { itemId = "#=Id#" })
.Data("function() { return getCommodityID('QTPGridItems_#=Id#');}"))
.Create(create => create.Action("Create_TreatmentPlan", "Screening", new { itemId = "#=Id#" }))
.Update(update => update.Action("Update_TreatmentPlan", "Screening", new { itemId = "#=Id#" }))
.Model(model =>
{
model.Id(p => p.Id);
model.Field(p => p.Id).Editable(false);
model.Field(p => p.RefQTool.Name).Editable(false);
model.Field(p => p.Responsable).Editable(true);
model.Field(p => p.QtoolLeader).Editable(true);
model.Field(p => p.Location).Editable(true).DefaultValue(ViewData["defaultLocation"] as LocationsViewModel);
model.Field(p => p.PlannedStartDate).Editable(true);
model.Field(p => p.PlannedEndDate).Editable(true);
model.Field(p => p.LastUpdateDate).Editable(true);
model.Field(p => p.Status);
})
)
.Selectable()
.Pageable()
.Sortable()
.Editable(editable => editable.Mode(GridEditMode.InCell))
.ToClientTemplate()
)
I have seen in some examples that i need to add .ClientTemplate("<div style='background-color: #=Status#;padding:10px;'> </div>"); to :
columns.Bound(o => o.Status).EditorTemplateName("QTPStatusEditor").Title("Status").ClientTemplate("<
div
style
=
'background-color: #=Status#;padding:10px;'
> </
div
>");
But When I dothat I get a javascript error : Uncaught ReferenceError : Status is not defined that you can see also in attached files. and the line is no more displayed in the grid.
you can also see the result i get in attached files.
Thank you in advanced for your help
Regards,
I run VS2015 and Kendo ASP.NET MVC on a Parallels VM (2 CPUs). I have found that my build times had increased from 1 minute to around 10 minutes and the CPU was running with 50% utilisation (i'm guessing one core at 100%) continuously even just in the IDE with no activity.
Disabling the VS extensions seems to solve the issue (but is not obviously what I'd like to do).
Is this behaviour to be expected?
Thanks
Richard
Hello,
I have a grid that use the following ViewModel :
public class TrackRowViewModel
{
public long Id { get; set; }
public string Name { get; set; }
public string Description { get; set; }
public MilestoneModel ms1 { get; set; }
public MilestoneModel ms2 { get; set; }
public MilestoneModel ms3 { get; set; }
public TrackRowViewModel() { }
}
witch use a MilestoneModel :
public class MilestoneModel
{
public long Id { get; set; }
public string Name { get; set; }
public string Description { get; set; }
public DateTime Date { get; set; }
}
I would like to display the date properly in the cells . And use datepicker to change it.
So i tried many way to do it, but the most revelant was Client template and EditorTemplate (ms1)
@(Html.Kendo().Grid<
Volvo.Qarma.MVCWebUIComponent.Models.Views.TrackRowViewModel
>()
.Name("gridproj")
.DataSource(dataSource => dataSource
.Ajax()
.Batch(true)
.Model(model =>
{
model.Id(o => o.Id);
model.Field(o => o.ms1).DefaultValue(
ViewData["defaultms"] as MilestoneModel);
model.Field(o => o.ms2).DefaultValue(
ViewData["defaultms"] as MilestoneModel);
model.Field(o => o.ms3).DefaultValue(
ViewData["defaultms"] as MilestoneModel);
})
.Read(r => r.Action("GetProjectsAllTracksObjectFromProject", "Project"))
.Create(c => c.Action("Editing_Create", "TracksAndMilestones"))
.Update(u => u.Action("Editing_Update", "TracksAndMilestones"))
.Destroy(d => d.Action("Editing_Destroy", "TracksAndMilestones"))
)
.Columns(columns =>
{
columns.Bound(o => o.Name);
columns.Bound(o => o.Description);
columns.Bound(o => o.ms1).Title("PCI").HtmlAttributes(new { @class = "color-PCI" }).EditorTemplateName("MilestoneDateEditor").ClientTemplate("#= kendo.toString(kendo.parseDate(ms1.Date, 'yyyy-MM-dd HH:mm:ss'), 'MM/dd/yyyy') #");
columns.Bound(o => o.ms2).Title("FeG").HtmlAttributes(new { @class = "color-Feg" }).EditorTemplateName("MilestoneDateEditor").ClientTemplate("#= kendo.parseDate(ms2.Date, 'yyyy-MM-dd HH:mm:ss') #");
columns.Bound(o => o.ms3).Title("CSG").HtmlAttributes(new { @class = "color-CSG" }).EditorTemplateName("MilestoneDateEditor").ClientTemplate("#=ms3.Date#");
})
.ToolBar(toolbar =>
{
toolbar.Create();
toolbar.Save();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
.Pageable()
.Navigatable()
.Sortable()
.Scrollable()
)
--The default value of fields ViewData["defaultms"] is an empty MilestoneModel object--
and the Editor as :
@model MilestoneModel
@(Html.Kendo().DatePickerFor(m => m.Date)
.Name("MilestoneDate")
.Format("MM/dd/yyyy")
)
My Problem is when change the date with the timepicker editor, the date isn't displaying on the grid properly .
Do i miss something ?
Thank you in advanced for your help
Regards,
Would like to use the editor to capture plain text. I cannot see a way to have the editor return plain text as opposed to HTML. I have turned off the toolbar but it still wants to return HTML.
Jim