I have a more detailed look at what I'm trying to do here (http://stackoverflow.com/questions/35158369/how-do-you-customize-kendoui-grid-column-menu-for-mobile), this is the only thing stopping me right now from using the GRID.

 After looking around for desktop mode I found how to modify the column menus.

 columnMenuInit: function (e) { console.log("menu init");var field = e.field; console.log(field);var menu = e.container.find(".k-menu").data("kendoMenu"); menu.append([{text: "Highlight", spriteCssClass: "k-i-custom", content: '<div class="colorpicker' + field + '"></div>'}]); $(".colorpicker" + field).kendoFlatColorPicker({ preview: false, value: "#000", change: select});};

However, this does not work for mobile when mobile:true is set for the grid (A.K.A adaptive rendering mode).  How would I customize the menu for the mobile version?

I am working a set of data that contains arrays as IDs. I need some help working around this as it appears unsupported and breaks some things.

Example item from the first set of data:

This data is referenced from second set of data which uses the same array IDs to refer to the first set. Example item from the second set of data:

For starters I am populating a Grid with the second set of data. I use a column.template to replace "head_port_id" and "tail_port_id" with the relevant "name" field from the first set of data. This works fine.

The problem arises when I try to use a DropDownMenu inside column.editor for the "head_port_id" and "tail_port_id" columns. Clicking the cell causes an error. 

Since I have the minified code it's difficult to debug this, even though I can see the full source code (a source map is loaded I assume). Breakpoints and scope vars aren't cooperating.

Anyway I had an idea which was to define a "parse" function for all of the array ID fields, in my Models. It simply converted the ID arrays .toString(). This works pretty well except that it has a fatal flaw in which the data I send to the relevant service is now invalid, since the service is expecting arrays and not strings.

How can I convert these IDs back to arrays, ideally without doing this in the DataSource transport functions (update, create, etc)? I have a generic DataSource wrapper that I am using to wrap our own CRUD interface.. I don't want it to have special cases in it for this once type of data.

Hi All

I am using kendo UI 2016.1.112 with angular and I am having an issue with sorting, the first time e.data.sort is populated nicely with the field and direction , second time same field and direction as desc but clicking for third time get an empty array

                 ///WTH ..... WHY?


I've got xslt file which consists of many tables. 
I set id to each table. How can I set grid on id?

<table class="grid" id="ID0EEC">
      <tbody><tr>
        <th>Numb</th>
        <th>Time</th>
        <th>Type</th> 
      </tr>
      <tr>
        <th>47217283640322</th>
        <th>10.01.2014 15:25:17</th>
        <th>ATM</th> 
      </tr>
      <tr>
        <th>46961091840322</th>
        <th>12.01.2014 09:07:47</th>
        <th>Kasino</th> 
      </tr>
      <tr>
        <th>46519990240322</th>
        <th>25.01.2014 22:47:00</th>
        <th>Cash</th> 
      </tr>
    </tbody></table>

<table class="grid" id="ID0EJG">
      <tbody><tr>
        <th>Numb</th>
        <th>Time</th>
        <th>Type</th> 
      </tr>
      <tr>
        <th>47217283640322</th>
        <th>10.01.2014 15:25:17</th>
        <th>ATM</th> 
      </tr>
      <tr>
        <th>46961091840322</th>
        <th>12.01.2014 09:07:47</th>
        <th>Kasino</th> 
      </tr>
      <tr>
        <th>46519990240322</th>
        <th>25.01.2014 22:47:00</th>
        <th>Cash</th> 
      </tr>
    </tbody></table>


I would like to do smth like thin in JS
  var gridArray = $("#grid");
        for (var i = 0; i < gridArray.length; i++) {
            var tmp = gridArray[i];
            var numb = tmp.getAttribute('id');
            $("#" + numb).kendoGrid({});
        } 

What is wrong?

What I'm trying to do is display some data in a specific column that is calculated by using the data from another column.

I currently have a function that returns the number of available licenses for the given 'Id' in JSON:

How do I go about displaying the number that is returned in a column named "AvailableLicenses"?

Here is my current Grid:

As you can see, I tried to create a null column with a template that calls the function for the given 'Id'.

By using Fiddler, I can see that the function is indeed being called for all of the rows, but the 'AvailableLicenses' column just displays "undefined" for every row.

Is there something I'm missing here to get this to work?

I could have a very n-deep treeview but the way the dataTextfield operates solves my problem. Is it possible, when the node is expanded, that you modify the array for which the dataTextField is displayed?

 For example:

 When the call is made to the service, the JSON Object return is:

The first node name should be : VBN

so the dataTextField: [SSM.securitySelectionModelName]

On the next get, it should be ["SSM.securitySelectionModelName", "SSM.classificationName]"

[{"id": 2, "isSSMNameNode": false, "tgtWeight": 0.0, "currWeight": 0.0, "hasChildNode": true, "ext_model_id": 14, "parent": {"id": 1, "isSSMNameNode": true, "tgtWeight": 0.0, "currWeight": 0.0, "hasChildNode": true, "ext_model_id": 1, "parent": null, "SSM": 1, "classificationNameNode": null}, "SSM": {"id": 1, "securitySelectionModelName": "VBN", "classificationNameNode": {"id": 14, "classificationLevel": 2, "classificationName": "MBS", "hasChildNode": false, "parent": 2}}]

 Is this possible to do on the expand event where I create the dataTextField array dynamically?

Hi,

    I'm not able to add Multi column Header grid. I'm trying this

@(Html.Kendo().Grid<SkyResMVC.Models.TAChartDetails>()
                        .Name("TAChartGrid")
                        .HtmlAttributes(new { style = "height: 400;" })
                        .Scrollable()
                        .Columns(columns =>
                            {
                                columns.Bound(p => p.RoomType).Width(120).Title("A");
                                columns.Group(group => group
                                .Title("Contact Info")
                                    .Columns(info =>
                                    {
                                        info.Bound(x => x.ContactTitle).Width(200);
                                    })
                            );
                            })
                                )

I'm getting error like this-

Kendo.Mvc.UI.Fluent.GridColumnFactory<SkyResMVC.Models.TAChartDetails>' does not contain a definition for 'Group' and no extension method 'Group' accepting a first argument of type 'Kendo.Mvc.UI.Fluent.GridColumnFactory<SkyResMVC.Models.TAChartDetails>' could be found (are you missing a using directive or an assembly reference?)

Please help me in this....

I'm using the grid setOptions/getOptions to save a particular view for a grid.   Basically a user can filter the grid in a certain way, show and hide columns, etc.

 In the grid I have several inline drop downs.  This is an example of one of the field definitions:

{ field: "LocationId", title: "Location Name", width: 200, editor: gridHelper.locationDropDownEditor, template: "#=gridHelper.getLocationCode(LocationId)#" },

On initial load everything works absolutely fine.  The problem comes in when the user selects a different view and I call setOptions to instantiate that view.   For the most part everything works, however when clicking on a cell with a dropdown the dropdown does not get reinitialized as a dropdown.  It's simply a text field with the right Location Name displayed, however when you click it you get the id#.

Is there a proper way to reinitialize those dropdowns using the model I've given above?

I've tried refreshing both the grid and the datasource along with destroying and recreating the grid from scratch but no options seem to lead to something that will work.

 Thanks!

Hi,

when I use declarative syntax, e.g.

<div id="app">
      <div id="list" data-role="list" data-bind="source: productsSource" data-template="tmpl"></div>
      <div id="pager" data-role="pager" data-bind="source: productsSource"></div>
 </div>

 and use MVVM binding to bind to dataSource:

var vm= kendo.observable({
           productsSource: new kendo.data.DataSource({
                    pageSize: 4, page: 1,
                    serverFiltering: true,
                    serverSorting: true,
                    transport: {
                          read: {
                              url: "http://demos.telerik.com/kendo-ui/service/Products",
                              dataType: "jsonp"
                             
                              }
                    }
                })
                      
            });
         
         
          kendo.bind($("#app"), vm);  

 there are two requests to http://demos.telerik.com/kendo-ui/service/Products (one for list and one for pager).

The whole example could be seen on: http://dojo.telerik.com/OHeMI/2

It is possible to reduce request count only to one?