Questions on UI for ASP.NET MVC Forum

1 answer

196 views

Wondering if you have code samples regarding validating different sections of the recurrence editor. For instance if the user selects a daily recurrence then deletes (using keyboard) the value in the "After" spinner or the "On" date/time picker. Or they do something similar with a Weekly recurrence and perhaps check none of "Repeat on" checkboxes and delete values for "After" or "On".

I see there is some reasonable default saved for RecurrenceRule in the database - is that by design as a way to avoid exhaustive validation? I can see this being a difficult ask, but it only takes one user to enter a recurring event incorrectly and it leads to a lot of confusion and questions. Is this a validation rabbit hole best avoided?

Scheduler

answered on 15 Mar 2019

1 answer

145 views

Binding scatterline to local data with date axis does not work

For my data in the following class:

public class MyModel

{

public double Value { get; set; }

public DateTime Date { get; set; }

}

I have a chart with the following configuration:

@(Html.Kendo().Chart<MyModel>()

.Name("MyChart")

.Series(series =>

{

series.ScatterLine(MyIEnumerableData)

.Fields("Date", "Value")

.Style(ChartScatterLineStyle.Smooth)

.Markers(m => m.Visible(false))

.Highlight(h => h.Visible(false))

.Labels(false)

.Name("Series1");

})

.XAxis(x => x

.Date()

.Title(title => title.Text("Date"))

)

.YAxis(y => y

.Numeric()

.Title(title => title.Text("Value"))

)

The axis range is correct, but the line is not displayed.

Examining the data contained in the widget on the page, the Date field is populated with (example): "/Date(1156934074549)/" instead of correctly-formed datetimes.

If I change my model to use a string instead of a datetime, and convert the datetime with .toString("yyyy-MM-dd HH:mm:ss"), the kendo widget appears to understand the data correctly, and it draws the line. This is fine as a workaround, but I should not need to convert the data like this.

Why does the kendo widget not understand datetime data? There is no override when specifying the fields to indicate the data type, and there is no method in the series definition to do this, either.

Chart

answered on 15 Mar 2019

1 answer

95 views

Images in cell

Is there anyway at all to add an image to a cell? We need a logo in the header. If that is not possible if we import one from the server is there a way to keep the image in place that is already there?

Spreadsheet

answered on 12 Mar 2019

6 answers

970 views

ListView inside a client template

I have a Grid with Ajax binding. One of the columns uses a client template with a ListView. Looks like that list view does not get initialized and bound, the grid cell where the ListView should be is rendered empty. The code for ListView is there it just does not get executed apparently. It does work with server-bound grid.

@(

Html.Kendo().Grid<CollegeAnnouncement>().Name("ItemsList2")

.Columns(col =>

{

col.Bound(i => i).ClientTemplate("<input type='checkbox' #if(Active){#checked='checked'#}# />").Title("Active?");

col.Bound(i => i.Heading).Encoded(false);

col.Bound(i => i.StartDate).Format("{0:MM/dd/yyyy}");

col.Bound(i => i.EndDate).Format("{0:MM/dd/yyyy}");

col.Bound(i => i).ClientTemplate(Html.Kendo().ListView<string>()

.Name("ItemRoles#=CollegeAnnouncementID#")

.TagName("div")

.HtmlAttributes(new { @class = "itemRolesList" })

.DataSource(ds => ds.Read(read => read.Action("ItemRolesGet", "CollegeAnnouncements")

.Data("{itemID: #=CollegeAnnouncementID#}"))).ClientTemplateId("roleItemTemplate")

.ToClientTemplate().ToHtmlString());

col.Bound(i => i).ClientTemplate("<a href='" + Url.Action("ItemDelete", new { itemID = "#=CollegeAnnouncementID#" }) + "'>Delete</a>");

})

.DataSource(ds => ds.Ajax().Read(read => read.Action("CollegeAnnouncementsList", "CollegeAnnouncements")).Model(m => m.Id("CollegeAnnouncementID")))

.Pageable()

)

ListView

answered on 12 Mar 2019

5 answers

1.5K+ views

Tooltips on Column Headings

I have a grid, with several columns with headings that are much too long to display. I have overcome this, by using a header template, with a bootstrap tooltip on it.
This works fine, however, if the column is made filterable, the filter icon is displayed in the wrong place, and is also the wrong colour.

col.Bound(o => o.Referral24HrsMedFit).ClientTemplate("#=Referral24HrsMedFit_Glyph#").HeaderTemplate(

"<span data-toggle='tooltip' data-placement='top' title='Referral to all agencies within 24hrs of being medically fit'>Ref..</span>"

);

Is there any way to prevent this?

Grid

answered on 12 Mar 2019

1 answer

96 views

Exel along with template

Current I have something like

.ToolBar(tools =>
{
tools.Excel();
tools.Template(
@<text>
<div class="show-declined-checkbox-group">
<input class="k-checkbox" id="ShowDeclinedItemsCheckBox" name="ShowDeclinedItemsCheckBox" type="checkbox">
<label class="k-checkbox-label" for="ShowDeclinedItemsCheckBox">Show Declined Items</label>
</div>
<div class="show-appoved-checkbox-group">
<input class="k-checkbox" id="ShowApprovedItemsCheckBox" name="ShowApprovedItemsCheckBox" type="checkbox">
<label class="k-checkbox-label" for="ShowApprovedItemsCheckBox">Items to be Approved</label>
<span id="needs-approval-span" class="badge badge-light"></span>
</div>
</text>
);
})

But I don't see the 'Export to Excel' button. Is the template somehow overriding the Excel button? How do I have both the Excel button and a "custom" toolbar?

Thank you

Grid

answered on 12 Mar 2019

6 answers

155 views

TableEditing tool disabled in editor

Working on upgrading to version 2019.1.115. On upgrade it appears that the Table Editor tool is functioning, but the quick select buttons are all disabled (see attached). This also appears to be the case in the demo version on https://demos.telerik.com/aspnet-mvc/editor/all-tools (image also attached). Is there any way to fix this? Is it a known issue? Thanks!

Editor

answered on 12 Mar 2019

7 answers

345 views

Controlling RecurrenceEditor.

Hi there,

I would like to disable or remove the <li> containing the "never" radiobutton, to force the user to set an end for the task. I managed to do this on the edit-event, but only for existing tasks. When I tried to hook the "change"-event of the recurrenceEditor, I couldn't get the selector $(':radio[value="never"]') to work. This part is undocumented, and a bit hard to "guess". Anyone got a hint?

Some example code:

01.<div data-container-for="recurrenceRule" class="k-edit-field">

02. <div data-bind="value:recurrenceRule" id="recurrenceEditorDiv"></div>

03. <script>

04. $(function() {

05. $("\#recurrenceEditorDiv").kendoRecurrenceEditor(

06. {

07. frequencies: ["never", "weekly"],

08. change: function(e) {

09. // This would be nice if it worked

10. var rb = e.container.find(".k-recur-end-never");

11. rb.attr('disabled', 'disabled');

12.

13. // Or this. This works in the grid's "edit"-event

14. var li = e.container.find(".k-recur-end-never")

15. .parent()

16. .parent();

17. li.remove();

18. },

19. messages: {

20. end: {

21. after: " efter ",

22. occurrence: " händelse(r)",

23. label: "Slut",

24. never: " aldrig",

25. on: " på "

26. },

27. frequencies: {

28. weekly: "per vecka",

29. never: "aldrig",

30. },

31. offsetPositions: {

32. first: "första",

33. second: "andra",

34. third: "tredje",

35. fourth: "fjärde",

36. last: "sista"

37. },

38. weekly: {

39. interval: " vecka(or)",

40. repeatEvery: "Intervall",

41. repeatOn: "Dagar "

42. },

43. weekdays: {

44. day: "Dag",

45. weekday: "Veckodag",

46. weekend: "Helgdag"

47. }

48. }

49. });

50. });

51. <\/script>

52.</div>

Scheduler

answered on 12 Mar 2019

2 answers

1.0K+ views

"n is not a constructor"

I am using version 2019.1.220 with Kendo UI for ASP.NET MVC, having upgraded recently from 2016.1.112, and I am now getting a Javascript error: "n is not a constructor". My chart is fairly simple:

@(Html.Kendo().Chart(Model.Errors)

.Name("AppErrorsChart")

.Title("Error BreakDown By % Frequency?")

.Legend(legend => legend

.Position(ChartLegendPosition.Top)

)

.Series(series =>

{

series.Pie<int>(model => model.Count, model => model.Type)

.Labels(labels => labels

.Visible(true)

.Template("#= category # - #= kendo.format('{0:P}', percentage)#")

);

})

.Tooltip(tooltip => tooltip.Visible(true).Template("#= dataItem.Error# (#= value#)").Color("#FFF"))

.Events(e => e.SeriesClick("onCategorySeriesClick").AxisLabelClick("onCategorySeriesClick")

)

Here is a Dojo that I created that demonstrates this: https://dojo.telerik.com/OBUzIVif

The error is in kendo.web.js, as shown in the attached screenshot.

Please advise on a course of action. Thank you.

Chart

answered on 11 Mar 2019

3 answers

516 views

Why many Web Font Icon showed black triangle?

Hello,

I try to use some web font icons on my project buttons but found many of them showed as same black small triangle. for example 'k-i-search' displayed as expected. but 'k-i-folder-open' and many others always showed as black triangle. Could any one tell me how to resolve the issue?

Thanks.

@(Html.Kendo().Button()
    .Name("search")
    .Tag("span")
    .Content("Search")
    .Icon("k-icon k-i-search") <--Good
)

@(Html.Kendo().Button()
    .Name("open")
    .Tag("span")
    .Content("Open")
    .Icon("k-icon k-i-folder-open") <--showed black triangle
)

Button