I need to prevent some users from modifying current occurrence of recurring appointment. I've built scheduler_edit function but now adding new appointments is also disabled. How to distinguish between them? I've also tried using e.event.isNew() but it didn't work because event is new in both current occurrence and adding new appointment.
I'm testing the grid for an almost certain purchase, and I've tried to export it to both PDF and XLS. With Excel it was almost straight forward, but when I try to follow the steps presented on the demo (http://demos.telerik.com/aspnet-mvc/Beta/grid/pdf-export) it does not work. When I click on the export button, the progress bar loads and when it finishes nothing happens, the action never gets to be executed.
This is my view:
@model IEnumerable<ViewModels.TestViewModel>
@{
ViewBag.Title = "Tests KendoUI";
}
<script src="~/Scripts/lib/jszip.min.js" type="text/javascript"></script>
<script src="~/Scripts/lib/pako.min.js" type="text/javascript"></script>
<style>
/*
Use the DejaVu Sans font for display and embedding in the PDF file.
The standard PDF fonts have no support for Unicode characters.
*/
.k-grid {
font-family: "DejaVu Sans", "Arial", sans-serif;
}
/* Hide the Grid header and pager during export */
.k-pdf-export .k-grid-toolbar,
.k-pdf-export .k-pager-wrap,
.k-pdf-export a.k-button.k-button-icontext,
.k-pdf-export .k-filter-row,
.k-pdf-export .k-grouping-header,
.k-pdf-export .k-grid tr td:last-child {
display: none !important;
}
</style>
@(Html.Kendo().Grid(Model)
.Name("grid")
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Products_Read", "Home"))
.Aggregates(aggregates => aggregates.Add(p => p.oper_monto).Sum())
)
.Columns(columns =>
{
columns.Bound(p => p.oper_numero).Hidden(true);
columns.Bound(p => p.oper_monto).ClientFooterTemplate("Total: #=sum#");
columns.Bound(p => p.cpto_codigo);
})
.Excel(excel => excel
.FileName("Reporte.xlsx")
.Filterable(true)
.AllPages(true)
.ProxyURL(Url.Action("Excel_Export_Save", "Home"))
)
.Pdf(pdf => pdf
.AllPages()
.FileName("Reporte.pdf")
.ProxyURL(Url.Action("Pdf_Export_Save", "Home"))
)
.ColumnMenu()
.ToolBar(t => t.Excel().Text("Exportar a Excel"))
.ToolBar(t => t.Pdf().Text("Exportar a PDF"))
.ToolBar(toolBar =>
toolBar.Custom()
.Text("Guardar Preferencias")
.HtmlAttributes(new { id = "save" })
)
.ToolBar(toolBar =>
toolBar.Custom()
.Text("Cargar Preferencias")
.HtmlAttributes(new { id = "load" })
)
.Filterable(ftb => ftb.Mode(GridFilterMode.Menu))
)
<script>
$(function () {
var grid = $("#grid").data("kendoGrid");
$("#save").click(function (e) {
e.preventDefault();
localStorage["kendo-grid-options"] = kendo.stringify(grid.getOptions());
});
$("#load").click(function (e) {
e.preventDefault();
var options = localStorage["kendo-grid-options"];
if (options) {
grid.setOptions(JSON.parse(options));
}
});
});
</script>
And this is my controller action:
[HttpPost]
public ActionResult Pdf_Export_Save(string contentType, string base64, string fileName)
{
var fileContents = Convert.FromBase64String(base64);
return File(fileContents, contentType, fileName);
}
Thanks in advance.
Hi,
I'm currently using a custom timeline view on my scheduler as my only view.
In this particular case the "business hours" button isn't really relevant.
How would one go about hiding this button as elegantly as possible?
Many thanks in advance.
Hi,
I'd like to edit a child collection of entities in a Grid with local data and inline edit. Is this possible?
I tried it and it doesn't work.
Thanks
Sven
Hi,
I have 2 tiers of Kendo Grids. They are defined as:
1st tier grid:
<% Html.Kendo().Grid<EvaluationsSummaryGridViewModel>()
.Name("EvaluationGrid")
.TableHtmlAttributes(new { style = "font-size:8pt;" })
.HtmlAttributes(new { style = "height:415px;width:1100px" })
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(a => a.EvaluationId))
.ServerOperation(true)
.Events(e => e.RequestEnd("onEvaluationSummaryRequestEnd"))
.Read(read => read.Action("GetEvaluationSummaryAjax", "Evaluations", new { yearId = ViewData["YearId"], evaluationVersionId = ViewData["EvaluationVersionId"] }))
.PageSize(15)
)
.Editable(e => e.Mode(Kendo.Mvc.UI.GridEditMode.InLine).Enabled(true))
.ClientDetailTemplateId("EvaluationOverallQuestionTemplate")
...
%>
2nd tier grid:
<script id="EvaluationOverallQuestionTemplate" type="text/x-kendo-template">
<%: Html.Kendo().Grid<EvaluationsSummaryOverallQuestionsGridViewModel>()
.Name("EvaluationGrid_#=EvaluationId#")
.TableHtmlAttributes(new { style = "font-size:8pt;" })
.HtmlAttributes(new { style = "height:320px;width:950px" })
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(a => a.EvaluationQuestionId))
.ServerOperation(false)
.Events(a => a.RequestEnd("onEvaluationsSummaryOverallQuestionsGridRequestEnd"))
.Read(read => read.Action("EvaluationsSummaryOverallQuestionsAjax", "Evaluations", new { evaluationId ="#=EvaluationId#" }))
)
.Pageable(pager => pager.Input(true)
.Refresh(true)
.PageSizes(new[] { 10, 20, 30 })
)
.Editable(e => e.Mode(Kendo.Mvc.UI.GridEditMode.InLine).Enabled(true))
.Scrollable(scrolling => scrolling.Height(300))
.Resizable(resize => resize.Columns(true))
.Sortable()
.Filterable()
.Columns(columns =>
{
columns.Bound(b => b.EvalutionMasterPillarId)
.Width(100);
columns.Bound(b => b.VersionQuestion)
.Width(300);
columns.Bound(b => b.HPAAssessment)
.Width(300);
columns.Bound(e => e.EvaluationStatusInitial)
.ClientTemplate("<div class='sprite sprite-StopLight_#=EvaluationStatusInitial#'></div>")
.Filterable(false)
.Sortable(false)
.HtmlAttributes(new { style = "text-align:center" })
.Width(100);
columns.Bound(e => e.EvaluationStatusCurrent)
.ClientTemplate("<div class='sprite sprite-StopLight_#=EvaluationStatusCurrent#'></div>")
.Filterable(false)
.Sortable(false)
.HtmlAttributes(new { style = "text-align:center" })
.Width(100);
})
.ToClientTemplate()
%>
</script>
The problem is that while 1st tier grid is working fine, 2nd tier grid can not be opened when clicking on the arrow on each row of 1st grid. The reason is ClientTemplate("<div class='sprite sprite-StopLight_#=EvaluationStatusInitial#'></div>"), which is supposed to display different icons based on the value of "EvaluationStatusInitial". I need help on how to make it work. Thanks.
Hi,
We upgraded the jQuery version to jquery-1.12.0.js on our site, and now we are noticing issues with the dropdown alignment, in Firefox and IE11. To investigate we checked the demo page, and noticed it is still using jquery-1.11.1.js. Any help, suggestions?
Demo: http://demos.telerik.com/aspnet-ajax/editor/examples/custommodules/defaultcs.aspx
Thanks.
I have two dropdown at layout screen which can be use by more than one view.
My first view contain layout screen(with cascading dropdown) and scheduler control.
1.On Page load ,both cascading dropdown should populate with default value with scheduler calendar.
2.Scheduler control should load based on cascading dropdown selection change.
Issue#1 : My second dropdown is not loading and it is disable.
issue#2 : Scheduler control loading before layout dropdowns call.
Layout view :
@(Html.Kendo().DropDownList()
.Name("Facility")
.HtmlAttributes(new { style = "width:100%" })
.DataTextField("FacilityName")
.DataValueField("FacilityId")
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetFacilityList", "Facility");
});
})
)
cascading dropdown:
@(Html.Kendo().DropDownList()
.Name("Location")
.HtmlAttributes(new { style = "width:100%" })
.DataTextField("LocationName")
.DataValueField("LocationId")
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetFacilityLocationsList", "Facility")
.Data("filterLocations")
.Type(HttpVerbs.Post);
})
.ServerFiltering(false);
})
.Enable(true)
.AutoBind(true)
.CascadeFrom("Facility")
)
<script>
function filterLocations() {
alert("filter");
return {
facilityId: $("#Facility").val()
};
}
Sceduler partial view:
@(Html.Kendo().Scheduler<ORSA.ViewModel.ScheduleViewModel>()
.Name("scheduler")
.Date(DateTime.Today)
.StartTime(6, 00, 00)
.EndTime(23, 00, 00)
.Height(800)
.Views(views =>
{
views.WeekView(weekView => weekView.Selected(true));
})
.Editable(editable =>
{
editable.TemplateName("CreateCase");
})
.Timezone("Etc/UTC")
.Group(group => group.Resources("Rooms"))
.Resources(resource =>
{
resource.Add(m => m.Room.RoomId)
.Title("Rooms")
.Name("Rooms")
.DataTextField("RoomCode")
.DataValueField("RoomId")
.BindTo(Model.RoomList);
})
.DataSource(d => d.Read("DisplayBlocks", "Schedule"))
)
Hi,
I'm currently looking into multi-select filtering for grids; I'm working with a very extensive grid that contains more than 100,000 meteorologic measured data from only about 30 distinct cities. I want the user of the grid to be able to filter the grid by one, multiple or all cities. In my controller, I do have a method that returns an array of the distinct city names, but I've yet to find a method to implement this.
This is the current code for the relevant column:
columns.Bound(c => c.MeteringStation).Title("Messstation").Width(200).Filterable(ftb => ftb.Multi(true).BindTo());
I figured I'd use .BindTo() for this, because .DataSource() doesn't seem to work. However, I don't know how to bind remote data to BindTo().
Thanks in advance
Hi,
When I try to get row number from the second grid nested I get null value. Do you know the way to get the correct value?
@(Html.Kendo().Grid<ExpeditionViewModel>()
.Name(
"expeditions"
)
.HtmlAttributes(
new
{ style =
"height: 100%; border: 0;"
})
.Scrollable()
.ToolBar(t =>
{
if
(User.IsInRole(
"Modify"
))
{
t.Create().Text(
"Nova Expedició"
);
}
})
.Columns(columns =>
{
columns.Bound(f => f.ExpeditionID).Width(100);
columns.Bound(f => f.Data).Width(80);
columns.ForeignKey(f => f.TransportID, (System.Collections.IEnumerable)ViewBag.Transports,
"ContactID"
,
"CodAutor"
).Width(100);
columns.Bound(f => f.Matricula).Width(80);
columns.ForeignKey(f => f.XoferID, (System.Collections.IEnumerable)ViewBag.Xofers,
"PersonID"
,
"Nom"
).Width(200);
columns.ForeignKey(f => f.OrigenID, (System.Collections.IEnumerable)ViewBag.Centres,
"ContactID"
,
"CodAutor"
).Visible(
false
);
columns.ForeignKey(f => f.DestiID, (System.Collections.IEnumerable)ViewBag.Centres,
"ContactID"
,
"CodAutor"
).Width(80);
columns.Bound(f => f.Kg).HtmlAttributes(
new
{ style =
"text-align: right;"
}).Width(90);
columns.Bound(f => f.Ticket).Width(80);
columns.Bound(f => f.Reparto).HtmlAttributes(
new
{ style =
"text-align: right;"
}).Width(80);
columns.Bound(f => f.TotalLitres).HtmlAttributes(
new
{ style =
"text-align: right;"
}).Width(90);
columns.Bound(f => f.TotalKg).HtmlAttributes(
new
{ style =
"text-align: right;"
}).Width(90);
if
(User.IsInRole(
"Modify"
))
{
columns.Command(commands =>
{
commands.Edit();
commands.Destroy();
});
}
})
.Editable(e => e.Mode(GridEditMode.PopUp).Window(w => w.Width(330)))
//.Events(e => e
// .Edit("expedition_onEdit")
//)
.Pageable(pageable => pageable.Refresh(
true
))
.Sortable()
.Filterable()
.ClientDetailTemplateId(
"Expedition_DetailTemplate"
)
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(18)
.Model(m =>
{
m.Id(f => f.ExpeditionID);
m.Field(f => f.TransportID).DefaultValue(ViewBag.DefaultTransportID);
m.Field(f => f.OrigenID).DefaultValue(ViewBag.DefaultCentreID);
m.Field(f => f.DestiID).DefaultValue(ViewBag.DefaultCentreID);
})
.Events(e => e
.Error(@<text> function(e) { onError(e,
"expeditions"
); }</text>)
)
.Sort(s => s.Add(f => f.ExpeditionID).Descending())
.Read(
"ExpeditionRead"
,
"Planning"
)
.Create(
"ExpeditionCreate"
,
"Planning"
)
.Update(
"ExpeditionUpdate"
,
"Planning"
)
.Destroy(
"ExpeditionDestroy"
,
"Planning"
)
)
)
@{
Func<
object
,
object
> expeditionDetailError = @<text>
function(e) {
if
(e.errors) {
onError(e,
"expeditionDetail_#=ExpeditionID#"
);
}
}
</text>;
Func<
object
,
object
> expeditionRequestEnd = @<text>
function(e) {
onRequestEnd(e,
"expeditionDetail_#=ExpeditionID#"
);
}
</text>;
Func<
object
,
object
> expeditionEdit = @<text>
function(e) {
expeditionDetail_onEdit(e,
"expeditionDetail_#=ExpeditionID#"
);
}
</text>;
}
<script id=
"Expedition_DetailTemplate"
type=
"text/x-kendo-tmpl"
><=== Second Grid
<div
class
=
"row"
>
@(Html.Kendo().Grid<ExpeditionDetailViewModel>()
.Name(
"expeditionDetail_#=ExpeditionID#"
)
.ToolBar(t =>
{
if
(User.IsInRole(
"Modify"
))
{
t.Create().Text(
"Afegir Servei"
);
}
})
.Columns(columns =>
{
columns.Bound(f => f.ServiceID).Width(80);
columns.Bound(f => f.ProductorID).Hidden();
columns.Bound(f => f.CodAutor).Width(80);
columns.Bound(f => f.ProductorName).Width(350).Filterable(f => f.Operators(g => g.ForString(h => { h.Clear(); h.Contains(
"Conté"
); })));
columns.Bound(f => f.Poblacio).Filterable(f => f.Operators(g => g.ForString(h => { h.Clear(); h.Contains(
"Conté"
); })));
columns.Bound(f => f.DataOrdre).Width(80);
columns.ForeignKey(f => f.HolderID, (System.Collections.IEnumerable)ViewBag.Centres,
"ContactID"
,
"CodAutor"
).Width(80);
columns.ForeignKey(f => f.DocTypeID, (System.Collections.IEnumerable)ViewBag.DocTypes,
"OptionID"
,
"ShortName"
).Width(50);
columns.Bound(f => f.DocNum).Width(80);
columns.Bound(f => f.JustNum).Width(40);
columns.ForeignKey(f => f.Reference, (System.Collections.IEnumerable)ViewBag.CatalegResidus,
"Value"
,
"Text"
);
columns.Bound(f => f.Litres).Width(60);
columns.Bound(f => f.Kg).Width(60);
columns.ForeignKey(f => f.StateID, (System.Collections.IEnumerable)ViewBag.ServiceStates,
"OptionID"
,
"Name"
).Width(100);
columns.ForeignKey(f => f.OwnerID, (System.Collections.IEnumerable)ViewBag.Users,
"PersonID"
,
"Nom"
).Visible(
false
);
if
(User.IsInRole(
"Modify"
))
{
columns.Command(commands =>
{
commands.Edit();
commands.Destroy();
});
}
})
.Editable(e => e.Mode(GridEditMode.PopUp).TemplateName(
"ExpeditionDetailEdit"
))
.Events(e =>
{
e.Edit(expeditionEdit);<== Event Edit
})
.Pageable(pageable => pageable.Refresh(
true
))
.DataSource(dataSource => dataSource
.Ajax()
.Model(model =>
{
model.Id(a => a.ServiceID);
model.Field(f => f.HolderID).DefaultValue(ViewBag.DefaultCentreID);
model.Field(f => f.StateID).DefaultValue((
short
)serviceState.Planned);
model.Field(f => f.OwnerID).DefaultValue(ViewBag.Usuari);
})
.Events(e => e
.Error(expeditionDetailError)
.RequestEnd(expeditionRequestEnd)
)
.Read(
"ServiceRead"
,
"Planning"
,
new
{ ExpeditionID =
"#=ExpeditionID#"
})
.Create(
"ServiceCreate"
,
"Planning"
,
new
{ ExpeditionID =
"#=ExpeditionID#"
})
.Update(
"ServiceUpdate"
,
"Planning"
)
.Destroy(
"ServiceDestroy"
,
"Planning"
)
).ToClientTemplate()
)
</div>
</script>
</div>
Event Edit
function expeditionDetail_onEdit (e, gridName) {
if
($(
"#DocTypeID"
).val() != @((
short
)documentType.FI))
$(
"#JustNum"
).hide();
var grid = $(
"#"
+gridName).data(
"kendoGrid"
);
//var data = grid.dataItem($(this).closest("tr"))
var row = grid.tbody.children(
".k-grid-edit-row"
);<== row = null
var data = grid.dataItem(
"tr:eq(0)"
);
//var grid = $("#"+gridName).data("kendoGrid");
//var row = grid.dataItem(this.select());
//var row = grid.tbody.children(".k-grid-edit-row");
//var codi = row.find("[name=ServiceID]").text();
//var name = row.find("[name=ProductorID]").text();
//var productor = codi + ' - ' + name;
//$("#ProductorID").data("kendoComboBox").input.val(productor);
Popup Template
<div
class
=
"container-fluid"
>
<div
class
=
"row"
>
<div
class
=
"form-horizontal col-md-12"
style=
"width:905px"
>
@Html.ValidationSummary(
true
,
""
,
new
{ @
class
=
"text-danger"
})
<div
class
=
"form-group"
>
@Html.LabelFor(model => model.DataOrdre,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-2"
>
@Html.EditorFor(model => model.DataOrdre)
</div>
@Html.LabelFor(model => model.HolderID,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-2"
>
@Html.EditorFor(model => model.HolderID)
</div>
</div>
<div
class
=
"form-group"
>
@Html.LabelFor(model => model.DocTypeID,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-1"
>
@Html.EditorFor(model => model.DocTypeID)
</div>
<div
class
=
"col-md-1"
>
@Html.Kendo().TextBoxFor(m => m).Name(
"DocNum"
).HtmlAttributes(
new
{ style =
"width:100px"
})
</div>
<div
class
=
"col-md-1"
>
@Html.Kendo().TextBoxFor(m => m).Name(
"JustNum"
).HtmlAttributes(
new
{ style =
"width:40px"
, maxlength =
"2"
})
</div>
</div>
<div
class
=
"form-group"
>
@Html.LabelFor(model => model.ProductorID,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-4"
>
@Html.EditorFor(model => model.ProductorID)
</div>
</div>
<div
class
=
"form-group"
>
@Html.LabelFor(model => model.Observacions,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-9"
>
@Html.TextAreaFor(model => model.Observacions,
new
{ @
class
=
"form-control"
, @rows = 5 })
</div>
</div>
<div
class
=
"form-group"
>
@Html.LabelFor(model => model.Reference,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-2"
>
@Html.EditorFor(model => model.Reference)
</div>
@Html.LabelFor(model => model.Litres,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-2"
>
@Html.EditorFor(model => model.Litres)
</div>
@Html.LabelFor(model => model.Kg,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-2"
>
@Html.EditorFor(model => model.Kg)
</div>
</div>
<div
class
=
"form-group"
>
@Html.LabelFor(model => model.Incidencies,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-9"
>
@Html.TextAreaFor(model => model.Incidencies,
new
{ @
class
=
"form-control"
, @rows = 5 })
</div>
</div>
<div
class
=
"form-group"
>
@Html.LabelFor(model => model.OwnerID,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-2"
>
@Html.EditorFor(model => model.OwnerID)
</div>
@Html.LabelFor(model => model.StateID,
new
{ @
class
=
"col-md-1 control-label"
})
<div
class
=
"col-md-2"
>
@Html.EditorFor(model => model.StateID)
</div>
</div>
</div>
</div>
</div>
Thanks in advance.