Telerik Forums
UI for ASP.NET MVC Forum
1 answer
545 views
Hi,

I am currently following the advice in this thread http://www.telerik.com/forums/using-datetimeoffset-in-column-filter in order to display datetimeoffset data in a grid. My questions are:

1) Are there plans to implement native support for the datetimeoffset type? It is a useful type for uniquely identifying a point in time above what datetime offers, so would be a useful type to support. The current solution seems a bit of a hack and native support would be much better.

2) Do I need to add any additional code to support columns sorting of datetimeoffsets as well as filtering? At present I am converting the datetimeoffsets to datetimes in my viewmodel to get around this issue.

My current code is as follows. The MapFilters function is as in the previous post. Should I be implementing a MapSorts function too? If so what would this look like?

Regards,

Michael
public ActionResult LogEntries_Read([DataSourceRequest] DataSourceRequest request)
{
    try
    {
        using (var db = new SysLogContext())
        {
            // convert datetimeoffsets to datetimes in the filters and sorts since Kendo does not support datetimeoffset
            if (request.Filters.Any())
            {
                request.Filters.MapFilters(descriptor =>
                {
                    if (descriptor.Member == "Date")
                    {
                        descriptor.Value = new DateTimeOffset((DateTime) descriptor.Value);
                    }
                });
            }
Daniel
Telerik team
 answered on 18 Aug 2014
1 answer
450 views
Hi,

I have a dataset with millions of entries in it which I am displaying in the grid using the following code:

@(Html.Kendo().Grid<LogEntryViewModel>()
    .Name("logsGrid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Id).Width(70);
        columns.Bound(c => c.Date).Format("{0:dd/MM/yy H:mm:ss}").Width(140);
        columns.Bound(c => c.IpAddress).Width(120);
        columns.Bound(c => c.Message);
     })
     .Scrollable( )
         .Sortable()
         .Filterable()
         .Pageable(pager => pager
             .Input(true)
             .Numeric(true)
             .Info(true)
             .Refresh(true))
         .Resizable(resize => resize.Columns(true))
            .HtmlAttributes(new {style = "height: 600px"})
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(50)
                .Read(read => read.Action("LogEntries_Read", "Home", new { maxResults = Model.MaxResults,  }))
        )
)

I would like to limit the amount of items returned (maxResults), say 1000 entries. I need this to work with server side filtering:

public ActionResult LogEntries_Read([DataSourceRequest] DataSourceRequest request, int maxResults)
{
    try
    {
        using (var db = new SysLogContext())
        {
            IQueryable<LogEntry> logs = db.LogEntries.Take(maxResults);
 
            try
            {
                var result = logs.ToDataSourceResult(request, logEntry => new LogEntryViewModel()
                {
                    Id = logEntry.Id,
                    IpAddress = logEntry.IpAddress,
                    Date = logEntry.Date.DateTime,
                    Message = logEntry.Message,
                });
 
                return Json(result);
            }
        }
    }
}

The problem with my code is that the .Take(maxResults) is performed before the filtering and sorting. This means that my grid does not display the correct results as expected, since the items are truncated before the filtering.

Is there a way of specifying a maximum number of returned entries in the ToDataSourceResult function? I need the filtering/sorting to be applied (server side) and then the returned results limited to <maxResults>, after the filtering and sorting is applied. I absolutely do not want millions of entries to be sent and then post-filtered, the filtering has to be done server side and then a limited number of results returned from the ToDataSourceResult function.

Thanks,

Michael
Dimo
Telerik team
 answered on 18 Aug 2014
4 answers
253 views
Hi,

I am trying to check the selected file sizes using IE8.

ie. Javascript as below:

 $(document).ready(function () {
            $("#attachments").kendoUpload({
                select: onSelect
            });
        });

Then when trying to retrieve the size in an onSelect javascript event of the selected files,  null is returned for the size of the file.
See attached jpg of IE8 javascript debugger.

Is there any workaround for this IE8 issue? 

Thanks,

Matt


Dimiter Madjarov
Telerik team
 answered on 18 Aug 2014
1 answer
169 views
I havet his Json 

[{"NumberOfDays":"41","Month":"1","year":"2013"},{"NumberOfDays":"8","Month":"2","year":"2013"},{"NumberOfDays":"14","Month":"3","year":"2013"},{"NumberOfDays":"6","Month":"4","year":"2013"},{"NumberOfDays":"-10","Month":"5","year":"2013"},{"NumberOfDays":"15","Month":"6","year":"2013"},{"NumberOfDays":"6","Month":"7","year":"2013"},{"NumberOfDays":"9","Month":"8","year":"2013"},{"NumberOfDays":"17","Month":"9","year":"2013"},{"NumberOfDays":"19","Month":"10","year":"2013"},{"NumberOfDays":"6","Month":"11","year":"2013"},{"NumberOfDays":"16","Month":"12","year":"2013"},{"NumberOfDays":"0","Month":"3","year":"2014"},{"NumberOfDays":"6","Month":"4","year":"2014"},{"NumberOfDays":"10","Month":"5","year":"2014"},{"NumberOfDays":"9","Month":"6","year":"2014"},{"NumberOfDays":"0","Month":"7","year":"2014"},{"NumberOfDays":"0","Month":"1","year":"2014"},{"NumberOfDays":"0","Month":"2","year":"2014"},{"NumberOfDays":"0","Month":"8","year":"2014"},{"NumberOfDays":"0","Month":"9","year":"2014"},{"NumberOfDays":"0","Month":"10","year":"2014"},{"NumberOfDays":"0","Month":"11","year":"2014"},{"NumberOfDays":"0","Month":"12","year":"2014"}]

Then I create this chart

 @(Html.Kendo().Chart<AceoHR.Models.simpleClass.simpleChartClass>()
    .Name("chart")
    .Title("Egenmeldingsdager")
    .DataSource(ds => ds.Read(read =>
        read.Action("GetStatsSickDaysByMonth", "SickDays"))
        .Group(g => g.Add(v => v.year))
        )
            .Series(series =>
            {                                                           
                series.Line(value => value.NumberOfDays, category => category.Month).Name("#:group.month#").Labels(labels => labels.Visible(false).Color("Red")).Color("Blue");
                //series.Area(model => model.NumberOfDays, ).CategoryField("Month");                
            })
               .CategoryAxis(axis => axis
                .Categories(model => model.NumberOfDays)
                .Labels(labels => labels.Rotation(-90))
                .Justify()
                .Crosshair(c => c.Visible(true))
            )
            .ValueAxis(axis => axis.Numeric()
                .Labels(labels => labels.Format("{0:N0}"))
            )
            .Tooltip(tooltip => tooltip
                .Visible(true)
                .Shared(true)
                .Format("{0:N0}")
            )
                )


The problem is that I'm not able to make this look as it should, check out the attach screenshot. The x axis should show the 12 months, the values on the graphs should show the NumberOfDays

Any advice
Hristo Germanov
Telerik team
 answered on 15 Aug 2014
1 answer
206 views
After i change datasource of my grid i cant use my editortemplate.
01.<%=
02.    Html.Kendo().Grid<InvoerPortaal.Models.VW_GetAllergenen_Result>()
03.    .Name("Allergenen")
04.    .Columns(columns =>
05.    {
06.        columns.Bound(p => p.AllergeenNaam);
07.        columns.Bound(p => p.AllergeenType).EditorTemplateName("AllergeenTypeEditor").Title("AllergeenType").ClientTemplate("thisismyclienttemplate");
08.    })
09.    .Editable(editable => editable.Mode(GridEditMode.InCell))
10.    .HtmlAttributes(new { style = "height:430px;" })
11.    .Events(events => events.Change("AllergenenTypeEditor_Change"))
12.    .DataSource(dataSource => dataSource
13.        .Ajax()
14.        .Batch(true)
15.        .ServerOperation(true)
16.        .Read(read => read.Action("Allergenen_Read", "Home", new { ArtikelID = 1}))
17.        .Events(events => events.Error("errorHandler"))
18.        .Model(model =>
19.        {
20.            model.Id(p => p.Allergeen_ID);
21.            model.Field(p => p.AllergeenNaam).Editable(false);
22.            model.Field(p => p.AllergeenType).DefaultValue(1);
23.        })
24.        .Update(update => update.Action("AllergeenType_Update", "Home"))
25.     )
26.%>


When clicking other grid to get "artikelid" i change datasource.read and then refresh the datasource.
1.var grid = $("#Artikelen").data("kendoGrid").dataItem(this.select());
2.var allergenenGrid = jQuery("#Allergenen").data("kendoGrid");
3.allergenenGrid.dataSource.read({ ArtikelID: grid.HBC_ArtikelID });
4.allergenenGrid.refresh();
5.$('.content-wrapper').show();

When I then try to edit the "AllergeenType" with the editortemplate i get the following error:

In chrome: Uncaught TypeError: undefined has no properties
In firefox: can't convert undefined to object
In IE11: (translate from dutch to english) Can't find object template from not defined empty value.(something like that)

As trace error it comes here:
(function(data<br>/**/) {<br>var o,e=kendo.htmlEncode;with(data){o='thisismyclienttemplate';}return o;<br>})

where thisismyclienttemplate is the string i filled in my clienttemplate, but i dont really see whats wrong with that, my clienttemplate shows up as it supposed to, but when i click the cell i get that error and my editortemplate doesn't show up.

Hope anyone could help me out.
Maikel
Top achievements
Rank 1
 answered on 15 Aug 2014
2 answers
750 views
I'm trying to implement the Kendo editor.  It was working great until I tried to add in the file upload feature.  I've stripped out all the kendo files and re added to make sure I had the latest version including the dll.  This is my _Layout header...


<head>
<meta charset="utf-8" />
    <title>@ViewBag.Title</title>
<link id="size-stylesheet" rel="stylesheet" type="text/css" href="~/Content/HighRes.css" />
    <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
        @Styles.Render("~/Content/kendo/css")
        @Scripts.Render("~/bundles/modernizr")
        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/kendo")
</head>

I feel like this is just a boneheaded error.  Any idea what i'm doing wrong....?
Daniel
Telerik team
 answered on 14 Aug 2014
3 answers
454 views
I need to know what the grid syntax for an update looks like in VB.. the lack of vb documentation is shocking.

I tried this code, but the update callback never fires, but it doesn't complain about it either.

@Code
    Html.Kendo().Grid(Of FAQRecord)() _
        .Name("FAQGrid") _
        .Columns(Sub(c)
                         c.Bound(Function(faq) faq.FAQID)
                         c.Bound(Function(faq) faq.Question)
                         c.Bound(Function(faq) faq.Answer)
                         c.Command(Sub(e) e.Edit()).Width(160)
                 End Sub) _
        .Pageable() _
        .Sortable() _
        .Filterable() _
        .Editable(Function(edit) edit.Mode(GridEditMode.PopUp)) _
        .DataSource(Function(d)
                            d.Ajax() _
                                .Read(Function(read) read.Action("FAQ_Read", "Home")).Model(Sub(rs) rs.Id(Function(rf) rf.FAQID)) _
                                .Update(Function(update) update.Action("FAQ_Update", "Home"))
                    End Function) _
        .Render()
End Code

The controller signature looks like this:
Function FAQ_update(request As DataSourceRequest, data As FAQRecord) As ActionResult
   'do stuff
    Return Json(result.ToDataSourceResult(request, ModelState))
End Function

Petur Subev
Telerik team
 answered on 14 Aug 2014
2 answers
204 views
I have a weird problem that I will try to explain with the attached images.  I have hierarchy grid that works perfectly when I expand to the first sub-grid.  The problem happens when I expand a latter row in the main grid.  The result is the first expanded sub-grid gets the values of the newly expanded sub-grid (which is empty).  The attached pictures show the before and after.  I included a third image which shows that if you expand a row that is above the first expanded row then it works fine.

Here is the stripped down code.  Any help will be greatly appreciated!

BTW, the code formatter would not accept my Razor code with Javascript (using Chrome).  It got confused.  I hope this turns out okay when I hit "Post"...

@using Kendo.Mvc.UI
@model PatientToolsAdminDesk.Models.AdminPractitionerForm
@{
    ViewBag.Title = "Order History";
}

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-primary" id="practitioner-panel">
                @Html.HiddenFor(a => a.did)
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="panel-body">
            @(Html.Kendo().Grid<PatientToolsAdminDesk.Models.PractitionerOrderHistory>()
                    .Name("order-history-grid")
                    .Columns(columns =>
                        {
                            columns.Bound(e => e.OrderID).Width(85);
                            columns.Bound(e => e.Status).Width(275);
                            columns.Bound(e => e.OrderType).Width(300);
                            columns.Bound(e => e.OrdererName).Width(150);
                            columns.Bound(e => e.Address);
                        })
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .Read(read => read.Action("HierarchyBinding_Orders", "Admin").Data("additionalData"))
                    )
                    .Sortable()
                    .Pageable()
                    .Scrollable()
                    .HtmlAttributes(new { style = "height:500px;" })
                    .ClientDetailTemplateId("orderdetailtemplate")
                )
            </div>
        </div>
    </div>
</div>

<script id="orderdetailtemplate" type="text/kendo-tmpl">
            @(Html.Kendo().Grid<PatientToolsAdminDesk.Models.PractitionerOrderItems>()
                .Name("order-item-grid")
                .Columns(columns =>
                {
                    columns.Bound(o => o.Quantity).Width(75);
                    columns.Bound(o => o.CreationDateShort).Width(100).Title("Date");
                    columns.Bound(o => o.Name).Width(250);
                    columns.Bound(o => o.GenericName).Width(250);
                    columns.Bound(o => o.Active).Width(50);
                })
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .Read(read => read.Action("HierarchyBinding_OrderItems", "Admin", new { orderID = "#=OrderID#" }))
                )
                .Pageable()
                .Sortable()
                .ToClientTemplate())
</script>

<script>

    $(document).ready(function () {
        $("#searchnew").text("DID: " + $("#did").val());
        $("#searchnew").bind("click", function () {
            $("#searchwindow").data("kendoWindow").center().open();
        });
    });

    function SearchPractitioner(arg) {

        var did = $("#search_did").val();
        var orderid = $("#search_orderid").val();
        if (!((did == "") && (orderid == ""))) {
            var grid = $("#items-grid").getKendoGrid();
            grid.dataSource.data([]);

            $.ajax({
                type: 'GET',
                dataType: "json",
                url: '/admin/GetPractitioner',
                data: { 'did': did, 'orderid': orderid },
                success: onSearchPractitioner
            });
        } else {
            $("#did").val("");
            $("#orderid").val("");

            $("#searchnew").text("DID: " + 'unknown');

            var grid = $("#items-grid").getKendoGrid();
            grid.dataSource.read();

            var grid = $("#order-history-grid").getKendoGrid();
            grid.dataSource.read();
        }
    }

    function onSearchPractitioner(arg) {

        $("#searchwindow").data("kendoWindow").close();

        $("#did").val(arg.did);
        $("#orderid").val(arg.orderid);
        $("#firstname").html(arg.firstname);
        $("#lastname").html(arg.lastname);
        $("#degree").html(arg.degree);

        $("#searchnew").text("DID: " + arg.did);

        var grid = $("#items-grid").getKendoGrid();
        grid.dataSource.read();

        var grid = $("#order-history-grid").getKendoGrid();
        grid.dataSource.read();
    }

    function additionalData() {
        return {
            did: $("#did").val(),
        };
    }
</script>
Nikolay Rusev
Telerik team
 answered on 14 Aug 2014
1 answer
236 views
So this is my first run at using the scheduler.  Got it up and got it populated using the MVC 5 wrapper.  However, when I go to "cancel" out of the details popup -- the event on the calendar disappears.  Any ideas how to prevent this?  Thanks!!
Alexander Popov
Telerik team
 answered on 14 Aug 2014
1 answer
612 views
Hello. We're having an issue with our datepickers, where only Sunday and Monday of the week are visible. I've attached a screenshot of the issue, and you can see how no other days of the week are visible. This persists whether you move to another month or not.

This issue is affecting all of our datepickers. We have several that are used in Grid Column Filters for date types (which generate automatically), as well as others that we have placed manually. Here is an example piece of our code declaring a datepicker:

<input kendo-date-picker id="statFromDate" ng-model="fromDate"/>

We don't have any CSS styles that i can see that affect the datepickers, their containers, or make changes to the k-calendar class.

Is there some sort of configuration option that we might have set up correctly? 

Thank you for your help!
Kiril Nikolov
Telerik team
 answered on 14 Aug 2014
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
ComboBox
Upload
MultiSelect
ListView
Window
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Map
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
Dialog
MultiColumnComboBox
DropDownTree
Checkbox
Slider
Switch
Notification
Accessibility
ListView (Mobile)
Pager
ColorPicker
DateRangePicker
Security
Wizard
Styling
Chat
DateInput
MediaPlayer
TileLayout
Drawer
SplitView
Template
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Licensing
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
+? more
Top users last month
Chester
Top achievements
Rank 1
Iron
Simon
Top achievements
Rank 1
Iron
Douglas
Top achievements
Rank 2
Iron
Iron
SUNIL
Top achievements
Rank 3
Iron
Iron
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Chester
Top achievements
Rank 1
Iron
Simon
Top achievements
Rank 1
Iron
Douglas
Top achievements
Rank 2
Iron
Iron
SUNIL
Top achievements
Rank 3
Iron
Iron
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?