Hi,
I am working on the scatter chart where the data should be plotted time(example:12:45:12) vs weekday(Monday).Where X-axis is Weekdays from Monday to Friday and Time is y-axis 9:00 am to 4:00 pm with Interval of 1 hour. I did not found any examples on this unable to achieve this.
Below is the sample code Kindly help me in this regard.
Thanks & Regards,
Sampath
<div class="roundbox" style="width:450px; height:350px; border: solid 5px steelblue; float:right; margin-top:10px; margin-bottom:20px">
@(Html.Kendo().Chart<AdvantEdgePortal.Web.ViewModels.DayTimeStamp>()
.Name("chartcallTimings")
.Title("Call Timings")
.DataSource(dataSource => dataSource.Read(
read => read.Action("GetCallDataCompletionTime", "Home"))
)
.Legend(legend => legend
.Position(ChartLegendPosition.Bottom)
)
.SeriesDefaults(seriesDefaults => seriesDefaults
.Scatter().Labels(labels => labels
.Visible(false)
)
)
.Series(series =>
{
series.Scatter(m => m.WeekDay, m => m.TimeofDay);
//series: [{ type: "scatterLine", name: "3.1C", data: [[10, 70], [13, 90], [25, 100]], dashType: "dot" }]
}
)
.CategoryAxis(axis => axis
.Categories("Monday", "Tuesday", "Wednesday", "Thrusday", "Friday")
.MajorGridLines(lines => lines.Visible(false))
.Categories(c => c.WeekDay)
)
.ValueAxis(axis => axis
.Numeric()
.MajorUnit(1)
.Min(9)
.Max(16)
.Labels(labels => labels.Format("{0:N0}:00"))
.Line(line => line.Visible(true))
)
.ChartArea(chartArea =>
{
chartArea.Height(340);
chartArea.Width(440);
chartArea.Margin(5);
})
)
</div>
Hello.
I'm using kendoValidator to display all my validation errors with the kendo validation template. Using this:
<
script
>
$(function () { $("form").kendoValidator();});
</
script
>
But I have certain errors that I handle server side in the controller. Because they are kind of complex. And then I added the errors to the model this way:
ModelState.AddModelError(
"Hours"
,
"The hours and the minutes can't be both 0."
);
But if I add an error this way it is displayed with the standard ASP NET MVC way:
<
span
class
=
"field-validation-error text-danger"
data-valmsg-for
=
"Hours"
data-valmsg-replace
=
"true"
>The hours and the minutes can't be both 0</
span
>
¿Is some kind of way to display those errors like the kendoValidator way?
In the image attached I show one error client side like kendo validation and two error's server side. I would like to all of then be like the client side error.
Thank you.
Hello.
I am using Export to Excel functionality.
Is there a way of adding page numbers to the excel generated from the grid?
I have tried the following but it does not work.
function excelExport(e) {
var sheet = e.workbook.sheets[0];
sheet.pageNumber = true;
}
Or is there any property which can be set when defining the Excel?
.Excel(excel => excel
.FileName("Users.xlsx")
.Filterable(true)
.ProxyURL(Url.Action("Excel_Export_Save", "UserAndGroup"))
)
Thanks
I have a Grid with a mix of static and dynamic columns. The static columns have a lot going on -- the user can choose groups of columns to display. There's formatting, commands, etc. I retrieve the main list of models from the database based on some filter criteria from the user. Based on the user selection for displayed columns, I augment the data returned with additional data and fill out more data on the models.
However, the tricky part is that users can customize additional fields they want to see in this table. These fields are dynamic. Our application is for building forms, so they define their own fields. Let's say a customer defines 200 fields they want to have on their form. Of those 200 fields, they wish to display 4 of them in the grid I'm struggling with. These fields are stored in a table "flat",so like:
CustomerID FieldID FieldName
1 1 "age"
The answers to these are stored like:
FieldID UserID Value:
1 1 25
I retrieve the data for these dynamic fields with a combination of Linq and SQL. I pivot the data, so get:
UserID 1 3 4 6
1 25 "foo" "bar" 3/4/2010
Currently, I'm taking these results and I'm adding it to a Dictionary<> per Model. Then I dynamically add them to my Kendo MVC grid:
foreach (var key in Model.AdminColumns.Keys)
{
c.Template(@<text>@item. </text>).ClientTemplate(String.Format("#=CustomFields['{0}']#", key.ToUpper())).HeaderTemplate(Model.AdminColumns[key]);
}
})
I can display the data just fine. However, I really need to add sorting and filtering to these columns. I understand that's not supported the way I'm doing it. The problem is, I can't seem to find a solution that will give me what I need. I can't change the nature of the data obviously. But, I'm willing to take a new approach. However, I keep running into road blocks. I tried using the dynamic keyword and building a model, but the grid helper didn't like that. I was thinking of going down the path of returning a json model with the dynamic fields merged in as first class members of each dataitem, but then i'm not sure how to define the grid.
Do you have any suggestions? My complete grid code is shown below.
@(Html.Kendo().Grid(Model.Donors).Name("DonorGrid")
.DataSource(ds =>
ds.Ajax()
.ServerOperation(false)
.Model(m => m.Id(x => x.DonorId))
.Read(r => r
.Action("GetDonors", "Donor")
.Type(HttpVerbs.Post)
.Data("getAdditionalData"))
.PageSize(Model.RowsPerPage)
)
//.ToolBar(t => t.Excel())
.Excel(e => e.FileName("DonorsExport.xlsx"))
.Columns(c =>
{
c.Group(g => g.Title(" ").CenterGroupHeader()
.Columns(cm =>
{
//cm.Select().Width(30);
cm.Bound(m => m.DonorId).ClientTemplate("<
a
href=\"/App/Donor.aspx/EditDonor?donorId=#=DonorId# \">Edit</
a
>").HeaderTemplate("Edit").Width(75).Filterable(false).Sortable(false).Locked(true).CenterCell();
cm.Bound(m => m.AdminThumbnail).ClientTemplate("<
img
src=\"#=AdminThumbnail#\"
width
=
50px
;").HeaderTemplate("").Visible(Model.Columns.Thumbnail).Width(75).Filterable(false).Sortable(false).Locked(true).CenterCell();
cm.Bound(m => m.Email).Visible(Model.Columns.Email);
cm.Bound(m => m.Unsubscribed).ClientTemplate("#if(Unsubscribed){# <
span
class
=
'red glyphicon glyphicon-flag'
></
span
> #}#").Visible(Model.Columns.Email).Width(80).CenterCell();
}));
c.Group(g => g.Title("Current Status").CenterGroupHeader()
.Columns(cs =>
{
cs.Bound(m => m.CompositeStatusText).HeaderTemplate("Status").Visible(Model.Columns.Status);
}));
c.Group(g => g.Title("Participation").CenterGroupHeader()
.Columns(cg =>
{
cg.Bound(m => m.ParticipationStatusText).HeaderTemplate("Participation").Visible(Model.Columns.Participation);
cg.Bound(m => m.ParticipationStatusDateTimeText).HeaderTemplate("Date").Format("{0:M/d/yy}").Visible(Model.Columns.Participation);
cg.Bound(x => x.LastLoginDays).HeaderTemplate("Last Login Date").Visible(Model.Columns.Participation);
}));
c.Bound(m => m.SharedStatus).HeaderTemplate("Shared").Visible(Model.Columns.Shared);
c.Group(g => g.Title("App Dates").CenterGroupHeader()
.Columns(ca =>
{
ca.Bound(m => m.PreScreenDate).HeaderTemplate("Pre-screen").Format("{0:M/d/yy}").Visible(Model.Columns.AppDates);
ca.Bound(m => m.OverallAppText).HeaderTemplate("Overall App").Format("{0:M/d/yy}").Visible(Model.Columns.AppDates);
ca.Bound(m => m.PercentComplete).HeaderTemplate("% Complete").Visible(Model.Columns.AppDates).Format("{0:P}");
ca.Bound(m => m.AppUpdateDays).HeaderTemplate("App Update").Visible(Model.Columns.AppDates);
}));
c.Group(g => g.Title("Eligibility").CenterGroupHeader()
.Columns(ce =>
{
ce.Bound(m => m.EligibilityPrescreen).ClientTemplate(
"<
div
>#= EligibilityPrescreen#<
br
/>" +
"#=Eligibility.ScreeningEligible#, #=Eligibility.ScreeningQuestionable#, #=Eligibility.ScreeningIneligible#" +
"</
div
>"
).HeaderTemplate("Pre-screen").Visible(Model.Columns.Eligibility);
ce.Bound(m => m.EligibilityOverall).ClientTemplate(
"<
div
>#= EligibilityOverall#<
br
/>" +
"#=Eligibility.OverallEligible#, #=Eligibility.OverallQuestionable#, #=Eligibility.OverallIneligible#" +
"</
div
>"
).HeaderTemplate("Overall").Visible(Model.Columns.Eligibility);
}));
c.Group(g => g.Title("Frozen").CenterGroupHeader()
.Columns(cf =>
{
cf.Bound(m => m.FrozenEnabled).ClientTemplate(
"<
table
><
thead
><
td
>A</
td
><
td
>S</
td
><
td
>I</
td
><
td
>N</
td
></
thead
><
tr
>" +
"<
td
>#=FooCount#</
td
>" +
"<
td
>#=SelectedCount#</
td
>" +
"<
td
>#=NotSelectedCount#</
td
>" +
"<
td
>#=NetworkCount#</
td
>" +
"</
tr
></
table
>"
).HeaderTemplate("Frozen Enabled").Visible(Model.Columns.FrozenEnabled);
}));
c.Bound(m => m.AlternateId).HeaderTemplate("Reference #");
foreach (var key in Model.AdminColumns.Keys)
{
c.Template(@<
text
>@item. </
text
>).ClientTemplate(String.Format("#=CustomFields['{0}']#", key.ToUpper())).HeaderTemplate(Model.AdminColumns[key]);
}
})
.Filterable()
.Pageable(p => p.AlwaysVisible(true).PageSizes(new[] { 25, 50, 100, 500, 1000 }))
.Sortable()
.Selectable(s => s.Mode(GridSelectionMode.Multiple).Type(GridSelectionType.Row).Enabled(true))
.Resizable(r => r.Columns(true))
.NoRecords("No donors were found matching this criteria."));
Hi,
I have 2 CategoryAxis, by Month and Year:
.CategoryAxis(axis => axis
.Date()
.Labels(l => l.Format(
"{0:MMM}"
))
.BaseUnit(ChartAxisBaseUnit.Months)
.MajorGridLines(lines => lines.Visible(false))
)
.CategoryAxis(axis => axis
.Date()
.Labels(l => l.Format(
"{0:yyyy}"
))
.BaseUnit(ChartAxisBaseUnit.Years)
.MajorGridLines(lines => lines.Visible(false))
)
Is there a way to align the Year within that Years Months. For instance currently the years are split evenly along the graph and not sitting within the Jan > Dec of the current year. See attached image.
Thanks.
HI
I have found that MaskedTextBox ClearPromptChar(true) NOT WORKS in Grid/EditorTemplates*.
Is there have any solution ?
*see attachment.
*Telerik DevCraft R2 2017 SP1.
Best regards
Chris
Hi,
I want to set my grid in percentage and not by pixels, I don't find the way to do it, because although I set the grid to be set by percentage it's always required pixels in the div uses the class "k-grid-content"
can you help me? I want the grid to look good in pc and also in laptop/
Thanks!
I developed a Kendo MVC Grid which displays a pop-up for updates. Popup Edit screen is a Custom template with a dropdown list that calls the controller to populate the . In this case, I am populating the prefixes. The is populated fine, but when I click on a row on the grid to edit an item, I need to pre-select the value in the drop-down. let's say if a particular row has a value of "Mr." as a prefix, I need it to be pre-selected in the popup .
If the use of a @Html.EditorFor(model => model.Prefix), it perfectly populates the editor fine. This doesn't work for Dropdown.
The editor template is called MemberEdit and the code in it is as below:
01.
@model Aamva.Api.Common.WebSite.Models.WebUser
02.
<
div
class
=
"col-lg-2"
>
03.
@Html.LabelFor(model => model.Prefix)
04.
@*@Html.EditorFor(model => model.Prefix)*@
05.
@(Html.Kendo().DropDownList()
06.
.Name("ddlPrefix")
07.
.DataTextField("Prefix")
08.
.DataValueField("PrefixKey")
09.
.DataSource(source =>
10.
{
11.
source.Read(read =>
12.
{
13.
read.Action("ListCustomerPrefix", "Home"); //.Data("additionalPrefixData");
14.
})
15.
.ServerFiltering(true);
16.
})
17.
// .Text(Model.Prefix)
18.
.Value(Model.PrefixKey)
19.
.AutoBind(false)
20.
.HtmlAttributes(new { style = "width: 100%" })
21.
)
22.
</
div
>
23.
<
div
class
=
"col-lg-2"
>
24.
@Html.LabelFor(model => model.FirstName)
25.
@Html.EditorFor(model => model.FirstName)
26.
@Html.ValidationMessageFor(model => model.FirstName)
27.
</
div
>
The Grid code is as shown below:
01.
@(Html.Kendo().Grid<
Aamva.Api.Common.WebSite.Models.WebUser
>()
02.
.Name("membersGrid")
03.
.Columns(columns =>
04.
{
05.
columns.Command(command => { command.Edit(); command.Destroy().Text("EZ Del"); }).Width("15%");
06.
columns.Bound(p => p.CST_KEY).Visible(false);
07.
columns.Bound(p => p.FullName).Width("20%").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
08.
columns.Bound(p => p.Role).Width("25%").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
09.
columns.Bound(p => p.Title).Width("20%").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
10.
columns.Bound(p => p.EmailAddress).Width("20%").Filterable(ftb => ftb.Cell(cell => cell.Operator("contains").SuggestionOperator(FilterType.Contains)));
11.
columns.Bound(p => p.Prefix).Visible(false);
12.
columns.Bound(p => p.Suffix).Visible(false);
13.
columns.Bound(p => p.RoleKey).Visible(false);
14.
columns.Bound(p => p.OrganizationMemberKey).Visible(false);
15.
}).Filterable(filterable => filterable
17.
.Extra(false)
18.
.Operators(ops => ops
19.
.ForString(str => str.Clear()
20.
.Contains("Contains")
21.
.StartsWith("Starts With")
22.
.IsEqualTo("Is Equal To")
23.
.IsNotEqualTo("Is Not Equal To")
24.
)))
25.
.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("MemberEdit").Window(w => w.Title("Edit Employee").Width(1100)))
26.
.Pageable(pager => pager.AlwaysVisible(false).PageSizes(new List<
object
> { 5, 10, 15, 20 }))
27.
.Sortable()
28.
.Filterable(ftb => ftb.Mode(GridFilterMode.Row))
29.
.HtmlAttributes(new { style = "width:100%;" })
30.
.DataSource(dataSource => dataSource
31.
.Ajax()
32.
.PageSize(10)
33.
.Events(events => events.Error("error_handler"))
34.
.Model(model => model.Id(p => p.CST_KEY))
35.
.Read(read => read.Action("ListMembers", "Home"))
36.
.Update(update => update.Action("EditingPopup_Update", "Home"))
37.
.Model(model =>
38.
{
39.
40.
model.Field(m => m.Title);
41.
model.Field(m => m.Prefix);
42.
model.Field(m => m.PrefixKey);
43.
model.Field(m => m.Suffix);
44.
model.Field(m => m.FirstName);
45.
model.Field(m => m.MiddleName);
46.
model.Field(m => m.LastName);
47.
model.Field(m => m.OrganizationKey);
48.
model.Field(m => m.FullName);
49.
model.Field(m => m.CustomerId);
50.
model.Field(m => m.OrganizationMemberKey);
51.
model.Field(m => m.EmailAddress);
52.
model.Field(m => m.CST_KEY);
53.
model.Field(m => m.Role);
54.
model.Field(m => m.RoleKey);
55.
model.Field(m => m.RoleList).DefaultValue(new List<
Aamva.Api.Common.WebSite.Models.WebUserRole
>());
56.
}
57.
)
58.
)
59.
)
The Model is as below:
01.
public class WebUser
02.
{
03.
public string CST_KEY { get; set; }
04.
public string EmailAddress { get; set; }
05.
public string Prefix { get; set; }
06.
public string PrefixKey { get; set; }
07.
public string Suffix { get; set; }
08.
public string Title { get; set; }
09.
public string FirstName { get; set; }
10.
public string MiddleName { get; set; }
11.
public string LastName { get; set; }
12.
public string OrganizationKey { get; set; }
13.
public string Role { get; set; }
14.
public string RoleKey { get; set; }
15.
public List<
WebUserRole
> RoleList { get; set; }
16.
}
17.
public class WebUserPrefix
20.
{
21.
public string PrefixKey { get; set; }
22.
public string Prefix { get; set; }
23.
}
i have downloaded and installed latest version of kendo UI for mvc into existing project. since then the datetimepicker doesn't stay open,can anyone help me with this.
thanks