I have the following kendo grid configuration,

backend service response scheme is correct, but doesnt work the virtual filter. I can't do virtual scrolling

var gridDefinition = {
    model: {
        id: "Id",
        fields: {
            Id: { type: "string" },
            Customer: { type: "string", editable: false },
            //other fields...              
        }
    },
    columns:[
        {
            field: "Customer",
            title: JsonModel.Resources.SAPCustomer,
            filterable: {
                multi: true,
                search: true,
                itemTemplate: function (e) {
                    var customers = $scope.customers || []; 
                    var itemsHtml = "";

                    for (var i = 0; i < customers.length; i++) {
                        var customer = customers[i];
                        itemsHtml += "<li class='k-item'><label class='k-label'><input type='checkbox' name='" + e.field + "' value='" + customer.Id + "'/><span>" + (customer.Description || customer.all) + "</span></label></li>";                                
                    }
                    return itemsHtml;
                }, 
                height: 220,
                virtual: {
                    itemHeight: 26,
                },
                dataSource: {
                    transport: {
                        read: {
                            url: JsonModel.Urls.ListIndexFilterUnique2,
                            type: "POST",
                            dataType: "json",
                            data: function () {
                                return {
                                    ColumnFilter: 'Customer'
                                };
                            }
                        }
                    },
                    requestEnd: function (e) {
                        if (e.type == "read" && e.response) {
                            if ($scope.customers) {
                                $scope.customers = $scope.customers.concat(e.response.customer);
                            } else {
                                $scope.customers = e.response.customer;
                            }
                        }

                    },
                    schema: {
                        data: "model",
                        total: "Total",
                        model: {
                            data: {
                                Id: { type: "string" },
                                Description: { type: "string" }
                            }
                        }
                    },
                    pageSize: 10,
                    serverPaging: true,
                    serverFiltering: true
                },
            },
            headerAttributes: { "class": "kendoui-column-header" }
        },//other columns

I can't seem to set the operator to be used to be contains.   And when I view your example at https://dojo.telerik.com/?_gl=1*u10xbr*_gcl_au*MTU1Njg2MDQ5Ni4xNjk3NjM0MzYz*_ga*Mjg2NDkyMzIyLjE2OTc2MzQzNjQ.*_ga_9JSNBCSF54*MTY5NzgxMzA3OS4zLjEuMTY5NzgyMzA0OS41LjAuMA.. it doesn't appear to be working either.

This is my exact use case.  I want the filterable mode to be set to row and on the cell I do not wish to show operators, but i wish to use the contains operator.

Any help would be appreciated.

Hi All,

My code creates a kendo grid.

When the filterable option is set to true, I see the built-in filter icon on the grid column header and that works fine.

If I set both the filterable:true and columnMenu:true, the filter icon disappears and I see only an icon for the column menu.

I found in the Kendo documentation the below.

When the columnMenu configuration is set to true, the Grid fires the columnMenuInit and columnMenuOpen events instead of filterMenuInit and filterMenuOpen.

Is there a way to have both the filter menu and column menu visible as shown below? Or at least some way when the user clicks on the filter icon to open the filter window? I want the user to be able to filter with one click, instead of clicking on the column menu and then clicking "Filter" to launch the filter screen.

Thank you in advance for any help!

Ran into a bug with the latest version, traced it back to the first release of the year, 2023.1.117.

This dojo works, using 2022.3.1109.

This dojo does not work, using 2023.1.117 or later.

The not working example displays "undefined" whereas the working one displays "$100".

i have controller using java as @RequestMapping("/charts") and it return in Json format but my question this data is not reflected in my Grid why. 

 $("#grid").kendoGrid({
                        dataSource: {
                           
                    transport: {
                         read: {
                             url: function(options) 
                             {   return "${pageContext.request.contextPath}/charts";
                                         },
                            
                            dataType: "json",
                            type: "GET"
                        }
                        },
                            
                            schema:{
                                model: {
                                    fields: {
                                        id: { type: "number" },
                                        fullName : { type: "string" },
                                        address: { type: "string" },
                                        email : { type: "string" },
                                        password: { type: "string" },
                                        designation: { type: "string" },
                                        salary: { type: "number" }
                                    }
                                }
                            },

                            aggregate: [ { field: "fullName", aggregate: "count" },
                                
                                          { field: "salary", aggregate: "sum" }
                                          ]
                             
                       ,pageSize: 8 },
                        sortable: true,
                        scrollable: false,
                       pageSize: 5,
                       pageSizes: true,
                        hieght:20,
                         pageable: {
                
           pageSizes: [4, 6,10,"all"],
           buttonCount: 5
                },
     columns: [
                   { field: "id", title: "ID", width: 180  },
                   { field: "fullName", title: "Name",width:300,
                    template: "<div style=color:red>#=fullName#</div>" ,footerTemplate: "Total Count: #=count#"  },
                     { field: "address", title: "Address",width:300 },
                      { field: "email", title: "Email",width:200},
                      { field: "password", title: "Password" ,width:200},
                            { field: "designation", title: "Designation" ,width:300},
                            { field: "salary", title: "Salary" ,width:200,footerTemplate: "Total Sum: #=sum#"},
                            { width:200,
                              template: "<a class='k-button' href='/Home/Index'>Redirect</a>"   }
                            
                        ]
                    });

I'm using the JQuery version inside Angular, because there is no Rating component for Angular.
When I change the precision to 'half', the star that is half only appears when I hover the mouse over it.

When start

After mouse over

Part of my code:

Does anyone have an idea how to resolve this?

Hi

I've implemented a bar chart to show the amount a customer has bought in USD but on the Y axis the 0 is showing with three decimals.

Understandable since I've added "n3" to the format property but how to remove the trailling zeros from it?

$("#chart_year").kendoChart({
     title: {
            text: '"Year To Date Purchases'
        },
        seriesDefaults: {
            type: "column",
        },
series: [
       {
          //Dummy Data before getting real data
          data: [122.142, 222.672],
          color: "rgb(0,125,195)",
          name: "Total",
       },
    ],
legend: {
    labels: {
       font: "Jost",  
    }
},
           valueAxis: {
   labels: {
       culture: "en-US",
       format: "${0:n3}",
       font: "Jost"
   },
   axisCrossingValue: 0
  },
   categoryAxis: {
      categories: previousYearsArray.reverse(),
       labels: {
            padding: {top: 5},
            font: "Jost"
        },
        majorGridLines: {
       visible: true  
    }
            },
    tooltip: {
        visible: true,
        format: "{0}",
        template: "#= series.name #: $#= value #"
}
   });

Hi....

Issue is the  icons don't change when clicking the expand/ contract button in the kendo-grid:

In the context of a hierarchical kendo grid,  it used to, in prior versions (2020.1.1118) swapped icons:

•  from + to - if the user desired to expand and show the child rows in a hierarchical table:

 from - to + if the user wanted collapse the child rows and show only the parent rows.

Now as of  version 2023.3.1010:

,,,something is interfering with my code, guessing that some  CSS references have changed.

Here is a DOJO link:

Untitled | Kendo UI Dojo (telerik.com)

If the link doesn't work (I am new to Kendo as of July and I still haven't gotten the hang of saving stuff on the DOJO) , I have attached a text file (with HTML) that the exact code to test in the DOJO.  You might need to stretch the right side that shows the active code to see the button in the header.

Also, the version prior to 2023.3.1010 showed an evil twin :) ... a little plus sign in addition to the default + plus icon... so you might want to go back a version to look at that too.

Can you give me some ideas on how to fix the issue of the icons NOT swapping on the 2023.3.1010 version when it was working fine previously?

Regards,

George

Hi all,

Is there a way to export a grid to png instead of pdf or convert the pdf output to a png in javascript?

Thanks,

Joseph Scott

I am json_encoding a php array for javascript variable that is used for the local binding to the kendo tree list. There can be 50000+ records for the kendo tree list and loading time of the page is around 15-20 seconds. The higher the amount do records the higher the loading times.  

The kendo tree list was previously remote binding, but found the performance of the tree list was poor when expanding parenet nodes. Therefore, resorted to local binding. Perfromance once loaded is good, but now number of records inserted are increasing.

How long should the kedno tree list take to load when locally binding 50,000+ records?

Thanks,

Fraser