We are getting a couple of problems when we trying to return the data with our custom api and consume through kendo for server side sorting and paging. The Kendo scripts seem to not like it and throws an error.

 Please find below the details:-

Web-api Result
 
data:{

count: 23,

  data: [

1.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1156, name: "Soda DPG For Test", type: 2,…},

2.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1157, name: "Coke DPG For Test", type: 2,…},

3.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1205, name: "Pespi Diet DPG", type: 2,…}

4.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1206, name: "Copy of Pespi Diet DPG",…},

5.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1238, name: "soda product group", type: 2,…},

6.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1196, name: "Blend Tea Bag DPG - edited",…},

7.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1193, name: "Blend Tea DPG", type: 2,…},

8.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1188, name: "Classic Blend DPG", type: 2,…},

9.  {$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1203, name: "Copy of Classic Blend DPG",…},

{$type: "EYC.Data.DynamicProductHierarchy, EYC.Core", id: 1236, name: "Copy of test create edited",…}

]

}

Exception, While data binding:

TypeError: e.slice is not a function

    at ht.extend.success (kendo.all.min.js:11)

    at Object.ht.extend.read.n._queueRequest.n.online.n.transport.read.success (kendo.all.min.js:11)



Angular js controller source
 

Demos.controller("MyCtrl", function ($scope) {

$scope.testgriddata = {

              dataSource: {

                   transport: {

   read:  {

                           method: "GET",

                           url: 'http://api.dev.test.com/product-hierarchies/nodes',

                          headers: {

                               "x-security-context": "102",

                               "Authorization": "eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiIsIng1dCI6InBmVTFLcUJVZ3BNb1hTME5nZ2dHdF9ZVGRBayJ9.eyJpc3MiOiJodHRwczovL2FjY291bnQuZGV2LmV5Yy5jb20vIiwiYXVkIjoidXJuOnNleWM6cnA6YXBpIiwibmJmIjoxNDMyODk5NDE0LCJleHAiOjE0NjQ1MjE4MTQsIm5hbWVpZCI6ImFkbWluIiwidW5pcXVlX25hbWUiOiJhZG1pbiIsImVtYWlsIjoiZXljQGV5Yy5jb20iLCJ1cm46ZXljLmNvbS9hLzEvY2xhaW1zL3NlY3VyaXR5LWNvbnRleHQiOlsiMTAwMDIiLCIxMDAwNSJdLCJhdXRobWV0aG9kIjoiaHR0cDovL3NjaGVtYXMubWljcm9zb2Z0LmNvbS93cy8yMDA4LzA2L2lkZW50aXR5L2F1dGhlbnRpY2F0aW9ubWV0aG9kL3Bhc3N3b3JkIiwiYXV0aF90aW1lIjoiMjAxNS0wNS0yOVQxMToyOToyMi45MTdaIiwiYWN0b3J0IjoiZXlKMGVYQWlPaUpLVjFRaUxDSmhiR2NpT2lKdWIyNWxJbjAuZXlKMWJtbHhkV1ZmYm1GdFpTSTZJa05PUFhObGVXTXRjbkF0WVhOd1pXTjBjeXdnVHoxRldVTXNJRk05VEc5dVpHOXVMQ0JEUFZWTElpd2lZWFYwYUcxbGRHaHZaQ"
                           },

   dataType: 'json'  },

                        parameterMap: function (data, type) {

                            if (type == "read") {

                                return {

                                    pagesize: data.pageSize,

                                    pagenum: data.page-1,

                                    sortcolumn: (data.sort != "undefined" && data.sort.length != 0) ? $scope.GetObjectKeyIndex($scope.testgriddata.columns, data.sort[0].field) : null,

                                    sortdirection: (data.sort != "undefined" && data.sort.length != 0) ? (data.sort[0].dir == "asc" ? 0 : 1) : null,

                                }

                               }

                           },

                        schema: { 

                            data: "data",

                            total: "count",

                           model: {

                               fields: {

                                   name: { type: "string" },

                                   description: { type: "string" },

                                   createdDate: { type: "date" },

                                   createdByUser: { type: "string" },

                                   type: { type: "string" }

                               }

                           }

                       },

                   },

                   pageSize: 25, 

                   serverPaging: true,

                   serverFiltering: false,

                   serverSorting: true,

                   sort: { field: "LastUpdatedDate", dir: "desc" }

               },

              

                   height: 550,

  

                   sortable: true,

                   //filterable: {

                   //    mode: "row"

                   //},

    pageable: {

        refresh: true,

       input: true,

        pageSizes: true,

        pageSizes: [5, 10, 15,20,25],

        buttonCount: 5

    },

     

    columns:

    [         

                      {

                          field: "name",

                          title: " Name",

                          filterable: {

                              cell: {

                                  showOperators: false

                              }

                          }

                      },

                    {

                        field: "description",

                        title: "Description",

                        filterable: {

                            cell: {

                                showOperators: false

                            }

                        }

                    },

                    {

                        field: "noofproducts",

                        title: "No of Products"

                    },

                     {

                         field: "type",

                         title: "Product Group Type",

                         template: "#= type==2?'Dynamic Product Group':'Custom Product Group' #",

                         filterable: {

                             cell: {

                                 showOperators: false

                             }

                         }

                     },

                  

                    {

                        field: "createdDate",

                        title: "Created Date",

                        template: "#= kendo.toString(kendo.parseDate(createdDate, 'yyyy-MM-dd'), 'MM/dd/yyyy') #"

                      

                    },

                    {

                        field: "createdByUser",

                        title: "Created By"

                    },

                    {

                        field: "LastUpdatedDate",

                        title: "Last Updated Date",

                        filterable: {

                            cell: {

                                showOperators: false

                            }

                        }

                    },

                     {

                         field: "LastUpdatedBy",

                         title: "Last Updated By",

                         filterable: {

                             cell: {

                                 showOperators: false

                             }

                         }

                     },

                     {

                         field: "LastUsedDate",

                         title: "Last Used Date",

                         filterable: {

                             cell: {

                                 showOperators: false

                             }

                         }

                     }]

           },

    $scope.GetObjectKeyIndex= function (obj, keyToFind) {

        var i = 0, key;

        for (key in obj) {

            if (obj[key].field == keyToFind) {

                return i+1;

            }

            i++;

        }

        return null;

    }

});

I'm developing an asp.net mvc web site where I need to display some data on a calendar, but are not events, otherwise records by date and I served Month view Schedule Widget.
I want to display a color box in a given day and use the features double click to create another record but with a different event and with other form fields, my question is how can I change the edit form and adapt it to a view of my mVC project?

Hi,

We have the following issue when we are using Kendo UI Templates

Our application is translation labels directly into the Kendo UI Template. But when we get special characters, like we have in the danish language like æøå and ÆØÅ, it will translate it to xml codes  æøå and ÆØÅ.

Because that it is using the character #, it will break the inline code also. Do Telerik have consider a way to handle situations like this, or is the only way to take care of it, on the client site through JavaScript code.

We are aware of, that we can make a escape code \ before the #, but we hope that Telerik have a better solutions for this ?

 

Thanks

 

 

Peter Beyer

CRM-Byggefakta

Hi,

I'm using ajax() binding on my grid datasource. (MVC Server Wrappers)
I have a PopUp Editor comming up showing my data i want to edit.

I want to display multiple checkboxes for one value. (have a look at the attached screenshot)
But when i select one checkbox, all other checkboxes get selected as well.

Do you have any clue?

Best regards,
Daniel

On adding a new task, I am wondering if there is a way to designate columns as particular element types (such as a dropdownlists) that way the user can be limited as to how each task is structured.  

I'm using Kendo templates for the first time, and used a previous grid example to create a datasource object for my template. As a result, my template datasources all have a schema > model > fields section, which I've determined I (probably?) don't need. The issue I'm having, however, is that attempting to remove these bits of code causes a low-level error in the Kendo JS:

Here's the original datasource code:

And here's some sample JSON returned from the function:

I started off trying to remove the whole model section, but got the error above. I then tried to remove the whole schema section, but got the same error. Then I thought it might be a specific field causing the error, so I went field by field, removing them one at a time until I got the error again. Unfortunately, it doesn't seem to be a specific field, since it's not until I got rid of all of them that there's an error again.

Here's an example of how I'm using these fields in my template:

I'm guessing it has something to do w/ the boolean checks I'm using in the template, but I'm not sure how to cast the values as booleans w/o using the schema model. 

So two questions - do I need to have the schema model for a template? And if not, how do I prevent the errors I'm receiving when I remove it?

Hey there,

I spent the last half day or so hunting a really annoying problem.  Maybe this Information can provide others meanings to get this sorted out quicker...

I created a Barchart which is filled by a  grouped DataSource. The Barchart is configured to stack the dataitems and group them by a category.  So far so good.

The Chart is displayed in Firefox without a problem, everything adds up and the stacks are correctly aligned. But when I display the same chart with Chrome the stacks are wrong. Meaning that the stack of category A contains elements with category B and vice versa.
After thorough investigation we narrowed the problem down to the default sort of the datasource. It seems that the chart depends on data that is correctly sorted by the category field, so that the items of every group are in the SAME ORDER. In Firefox that is the case, probably because my original data was already sorted in that way, but in Chrome (which apparently uses QuickSort (for arrays with 10 or less elements ) => NOT STABLE) the order for one entity is wrong. And so the elements in the chart are mixed up. If you ask me the charts implementation for dividing the categories MUST NOT rely on correctly sorted Datasources or if so it should enforce are correct sorting.

We fixed the problem by explicitly providing a sort-clause to the datasource specifying both the group field and after that the category field.
Heres a Fiddle to reproduce the issue:
http://jsfiddle.net/zaCPt/3/
Use Chrome if you want to see the difference! Or look at the attached screenshot, both charts use the same data. Top is unsorted datasource, Bottom is sorted
Chrome Version is 28.0.1500.95 m

Regards,
Kristoffer Witt

I bind to list of columns, some of them are complex like "ProfileDetails" property.
If we bind to a complex column like “ProfileDetails.FullAddress” while “ProfileDetails” object is null in received data  
we get an exception on JavaScript code and no data appear. 

can any one tell me how to fix it 

I'm trying to use the databound event with an MVC Kendo Grid, but DataBound is not in the list of options.  I really need a javascript method to fire after the data is rendered to make use of it, and based research, I really can only do it with the databound event.  I'm using version 2015.1.429.340 of the dll, which is the most recent I could find. I have Sync, Push, RequestEnd, many other events available.  Just not DataBound.  

 

My code looks like this:

 

@(Html.Kendo().Grid<type>()
                .Name("name")
                .Columns(columns =>
                {
                    column stuff
                })
                .DataSource(dataSource => dataSource
                    .Ajax()
                            .Read(read => read.Action("method", "controller", new { id = "idstuff" }))
                            .Events(events => events.DataBound("method") )      
                )                
                .ToClientTemplate()

)

 

I hover over the red squiggly on DataBound and I see:

 

Kendo.Mvc.UI.Fluent.DataSourceEventBuilder does not contain a definition for DataBound and no extension method for DataBound accepting the first argument of type 'Kendo.Mvc.UI.Fluent.DataSourceEventBuilder' could be found.

 

Can someone please help me rectify this issue?

 

Thanks!

 

 

Are we able to bind the left and right side of the sliders to ng-models? For example, this is what I expect to be able to do:

http://dojo.telerik.com/OCuTI/73