Completed
Last Updated: 27 Dec 2019 13:32 by ADMIN
Created by: Chingis
Comments: 1
Category: Grid
Type: Feature Request
0

Request

I'd like to ask for a demo which utilizes the most up to date approach to creating a Kendo UI Grid using NPM, TypeScript, and in a SharePoint 2019 with a Gulp serve environment. 

Thank you for your consideration!

Declined
Last Updated: 27 Dec 2019 13:31 by ADMIN
  1. Create a grid with two editable columns.
  2. Define validation rules for both columns. Keep one column as required.
  3. Edit the row. Set the required column value using model.set method.'

It fails because before setting the value it performs validation. If validation was successful then it will set the value on model.

Since the desired field has no value and validation rule will fail on that.

 

It should accept the value and then perform validation. If validation fails with new value then it might discard the changes.

 


$("#grid").kendoGrid({ dataSource: { batch: true, transport: { read: function(e){ e.success([1,2,3,4,5,6,7,8,9].map(function(i){return {id: i, title: "test" + i}})); } }, schema: { model: { id: "id", fields: { id: {defaultValue: "-1"}, title: { validation: { required: true } } } } } }, columns: [ {field: "title", title: "Title", filterable: {field: "title.a"}}, {command: ["edit", {name: "destroy"}]} ], editable: {mode: "inline"}, filterable: true, toolbar: [{name: "create"}] });

 

var grid = $("#grid").getKendoGrid();
var model = grid.dataItems()[0];
grid.editRow(model);
model.set('title', '');
model.set('title', 'test 1111'); // it will fail


 

Completed
Last Updated: 13 Jan 2020 09:22 by ADMIN
Release R1 2020

When using the Nova theme locked command columns are not styled correctly.   
In the following dojo one command column is locked and not styled while another command column is not locked but styled correctly.
https://dojo.telerik.com/eWECAZEw

Here's the code in case the dojo doesn't work:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.619/styles/kendo.common.min.css">
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.619/styles/kendo.rtl.min.css">
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.619/styles/kendo.nova.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.2.619/styles/kendo.mobile.all.min.css">

    <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2019.2.619/js/kendo.all.min.js"></script>
</head>
<body>
  
<div id="grid"></div>
<script>
  var dataSource = new kendo.data.DataSource({
    data: [
      { category: "category 1", subCategory: "sub. category 1", name: "product 1", val: 1 },
      { category: "category 1", subCategory: "sub. category 1", name: "product 2", val: 1 },
      { category: "category 1", subCategory: "sub. category 1", name: "product 3", val: 1 },
      { category: "category 1", subCategory: "sub. category 1", name: "product 4", val: 1 },
      { category: "category 1", subCategory: "sub. category 2", name: "product 5", val: 1 },
      { category: "category 1", subCategory: "sub. category 2", name: "product 6", val: 1 },
      { category: "category 1", subCategory: "sub. category 2", name: "product 7", val: 1 },
      { category: "category 1", subCategory: "sub. category 2", name: "product 8", val: 1 },
      { category: "category 1", subCategory: "sub. category 3", name: "product 9", val: 1 },
      { category: "category 1", subCategory: "sub. category 3", name: "product 10", val: 1 },
      { category: "category 1", subCategory: "sub. category 3", name: "product 11", val: 1 },
      { category: "category 1", subCategory: "sub. category 3", name: "product 12", val: 1 },
    ]
  });
  
$("#grid").kendoGrid({
  columns: [
    { command: "edit", locked: true, width: 150 }, // <<-- columns is locked
    { field: "category", locked: true, width: 150 }, // <<-- columns is locked
    { command: "edit", width: 150 },
    { field: "subCategory", width: 200 },
    { field: "name", width: 500 }
  ],
  dataSource: dataSource,
  scrollable: true,
  selectable: "row"
});
</script>
</body>
</html>
Completed
Last Updated: 27 Dec 2019 13:27 by ADMIN

Hi Team,

 

We are have gone through the documentation for make specific column editable. We found that we need to make it in schema. As we are using some complex objects along with ODATA expand.

We are unable to maintain or Add all the fields under schema.If we make a editable property of column to Boolean and based on value framework will me either read-only or editable.

 

Consider a scenario like Grid with 10 columns based on quantity, price,discount change need to calculate the tax.

Here tax calculation will be dynamic and some columns we can add on the fly.

In some cases like ODATA expand  if i want to make expanded column to editable then it a tough process to edit

like above situations it will be useful if we make column editable to Boolean for achieve column level editing

 

Thanks

Unplanned
Last Updated: 30 Sep 2019 12:34 by ADMIN
Created by: Peter
Comments: 1
Category: Grid
Type: Feature Request
0

As followup on Ticket ID: 1431527 screenshots and sample code provided.

"The GridColumnBuild does not have an implementation for the Locked functionality against the dynamic type. The class that gets serialized and sent to the client-side would not have a property for the locked column, therefore, there would be no locked columns."

Can you please examine this functionality?

 

Best,

Peter

Declined
Last Updated: 19 Nov 2024 10:47 by ADMIN
Created by: Peter
Comments: 3
Category: Grid
Type: Bug Report
0
  • Create e.g. local data grid (id, name)
  • add 2 records => { id: 1, name: "null", id: 2, name: "Jack" }
  • Name column for id = 1 is empty

I have tested this on your example for local data grid. It can be applicable also for remote grid, treelist, etc.

 

Completed
Last Updated: 13 Jan 2020 09:21 by ADMIN
Release R1 2020

Bug report

Regression introduced in R3 2019 SP1. Reproducible with the LESS themes.

Reproduction of the problem

Dojo example.

  1. Open a column filter menu and click on one of the dropdowns in it.

Current behavior

All of the text in the filter menu gets selected.

Expected/desired behavior

No text selection.

Environment

  • Kendo UI version: 2019.3.1023
  • jQuery version: x.y
  • Browser: [Chrome 77 | Firefox 69 ]
Unplanned
Last Updated: 15 Oct 2020 12:54 by ADMIN
Scheduled for 2020.R3.SP.next
Created by: pablo
Comments: 1
Category: Grid
Type: Bug Report
0

Hello, the Excel Export doesn't export the columns headers sums (view in image).

Is it possible export to Excel columns headers sums?

Completed
Last Updated: 10 Jan 2024 08:12 by ADMIN

Bug report

Reproduction of the problem

Dojo example.

  1. Drag the page splitter to resize the screen and see the Grid's pager correctly switch between the different responsive styles (expected)
  2. Click the "Open Modal" button, which opens a Kendo Window with another Grid in it
  3. Drag the page splitter and/or resizing the Window to see each of the Grid's paging styles changing accordingly (expected)
  4. Close the Window (destroy is called in the deactivate event handler)
  5. Try again to drag the page splitter to resize the screen. This time, the Grid's pager is no longer responsive

Current behavior

Responsiveness of the pager of a Grid declared outside the Window is affected by the Window's destroy method.

Expected/desired behavior

Calling the destroy method has no unexpected effect on components that are not nested in the Window.

Environment

  • Kendo UI version: 2019.3.1023
  • jQuery version: x.y
  • Browser: [all ]
Completed
Last Updated: 06 Oct 2020 14:46 by ADMIN
Release 2020.R1.SP1
Created by: Gary
Comments: 0
Category: Grid
Type: Bug Report
0

Bug report

Regression introduced in 2019.2.619.
Related commit: telerik/kendo@2a806f6#diff-f810c335b76ea2e4d78327457f230a46L3882-R3882

Reproduction of the problem

Dojo example.

  1. Add a new record.
  2. Click "Update" in the editor.

Current behavior

The following validation message is displayed: ! name

Expected/desired behavior

The validation message should be: ! name is required

Environment

  • Kendo UI version: 2019.3.1023
  • jQuery version: x.y
  • Browser: [all]
Completed
Last Updated: 27 Apr 2020 12:26 by ADMIN
Release 2020.R2
Created by: kvlachakis
Comments: 1
Category: Grid
Type: Bug Report
0

Hi,

the adaptive rendering in the grid control is not working in the current version(2019.3.1023).

To reproduce go to https://docs.telerik.com/kendo-ui/controls/data-management/grid/appearance/adaptive#configuring-panes-on-mobile --> Open in Dojo --> Run and the 2 rows are not displaying. If you switch to version, choose Library dropdown, 2018.3.1017 or up to 2019.1.220 the 2 rows are ok. 

Similar behaviour is inspected to the scheduler control agenda view. To reproduce go to https://docs.telerik.com/kendo-ui/controls/scheduling/scheduler/adaptive-rendering#configuring-panes-on-mobile --> Open in Dojo --> Run --> change view from week to Agenda and the 2 events are not shown. If you switch to version, choose Library dropdown, 2018.3.1017 or up to 2019.1.220 the 2 events are ok. 

Tried in chrome, safari and mobile phones.

thanks,

Kostas Vlachakis

Completed
Last Updated: 13 Dec 2019 14:53 by ADMIN

In the popup edit grid, when the editable: false option is displayed, the portion of the value is at the top rather than horizontal. Can you change it horizontal?
Completed
Last Updated: 24 Jan 2020 07:18 by ADMIN
Created by: David
Comments: 1
Category: Grid
Type: Feature Request
0
Would it be possible to add an option for a top scroll on the grid?
Completed
Last Updated: 06 Oct 2020 14:15 by ADMIN
Release 2020.R1.SP1
Created by: Jean-Francois
Comments: 1
Category: Grid
Type: Bug Report
0

grid column virtualization issue with hidden column.

When you scroll further in your grid having one or multiple hidden column(s) the value of the hidden column appears in a side column.

 

 

<!DOCTYPE html>
<html>
<head>
    <base href="https://demos.telerik.com/kendo-ui/grid/column-virtualization">
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
    <title></title>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2020.1.114/styles/kendo.default-v2.min.css" />

    <script src="https://kendo.cdn.telerik.com/2020.1.114/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2020.1.114/js/kendo.all.min.js"></script>
    

</head>
<body>
<div id="example">
    <div id="grid"></div>
    <script>
        $(function() {
            var columns = [];
            var data = [];
            var numberOfColumns = 500;
            var numberOfRows = 100;
            var field;
            var row;
            var i;
            var j;
               
            for (i = 1; i <= numberOfColumns; i++) {
                field = ("Field" + i);
              if(i==2)
                columns.push({ field: field, title: field, width: 200, hidden: true });
              else
                columns.push({ field: field, title: field, width: 200 });
            }
            for (i = 1; i <= numberOfRows; i++) {
                row = {};
                for (j = 1; j <= numberOfColumns; j++) {
                    field = ("Field" + j);
                    row[field] = "R" + i + ":C" + j;
                }
                data.push(row);
            }

           var dataSource = new kendo.data.DataSource({
               pageSize: 10,
               transport: {
                   read: function(e) {
                       e.success(data);
                   }
               }
           });
           
           $("#grid").kendoGrid({
               dataSource: dataSource,
               sortable: true,
               scrollable: {
                   virtual: "columns"
               },
               width: 1000,
               navigatable: true,
               filterable: true,
               columnMenu: true,
               pageable: {
                   refresh: true,
                   pageSize: 10,
                   pageSizes: true,
                   buttonCount: 5
               },
               columns: columns
           });
        });
    </script>
</div>


</body>
</html>
Completed
Last Updated: 29 May 2020 07:55 by ADMIN

Bug report

Grid's layout breaks when having columns with defined widths which sum exceeds 960px and the scrollable property is set to false.

Regression introduced in 2020.1.114

Reproduction of the problem

Open this Dojo in fullscreen and see Grid's layout.

If you change the Kendo UI version to 2019.3.1023, Grid's toolbar is correct

Current behavior

Grid's layout is breaking
image

Expected/desired behavior

Grid's layout shouldn't break.
image

Environment

  • Kendo UI version: 2020.1.114
  • jQuery version: x.y
  • Browser: [all]
Completed
Last Updated: 05 Mar 2020 14:56 by ADMIN

When resizing column widths have an option to lock the last column to the right hand border of the grid when sum of columns total width is smaller than grid. This way the grid will always fill the columns to the width of grid. For example if user reduces column 2's size in a 3 column grid then increase the size of column 3 so that it keeps the grid full width.

 Instead of this:

 

It would look like this:

 

 

Completed
Last Updated: 10 Mar 2020 14:31 by mathieu
Created by: mathieu
Comments: 5
Category: Grid
Type: Bug Report
0

Hi, 

 

There is a bug on the kendo grid when you have inline editing and a filter applied

So what's happening is that when you apply a filter and then click on "add new record" it doesn't show the new record, even worst it actually add the new empty record in the datasource, so you see new empty line when you remove the filter ....

it's really easy to demonstrate, i make you a dojo : https://dojo.telerik.com/EJIhohuf

this dojo is actually the editing inline demo (https://demos.telerik.com/kendo-ui/grid/editing-inline) with just the filtering enabled like so :

filterable: {
        mode: "row"
    }

to reproduce :

- apply any kind of filtering

- try to add a new record

- here you see nothing is happening, we expect to see a new empty line to add a new record (also the beforeEdit event is not fired but not sure this is a bug)

- remove the filtering

- you can see the empty lines (if click 5 times on add new record you get 5 empty lines)

 

Best regards,

you have a great product hope you can improve it even more 

Completed
Last Updated: 12 Oct 2020 07:48 by ADMIN
Release 2020.R3.SP.next

Take this Dojo: https://dojo.telerik.com/iCECeXeC

1. Press 'Run'
2. Remove the filter for Contact Title
3. Press 'Save State'
4. Reload page (F5)
5. Press 'Run'
6. Press 'Load State'

Result: The filter for Contact Title is not removed.

 

On the other hand if I do the following:

1. Press 'Run'
2. Change the filter for Contact Title to 'Sales Representative'
3. Press 'Save State'
4. Reload page (F5)
5. Press 'Run'
6. Press 'Load State'

Result: The filter for Contact Title is changed correctly to 'Sales Representative'

 

Why is the first example not working? Is this intended behaviour or a bug? Is there a workaround?

 

Kind regards.

Declined
Last Updated: 17 Mar 2020 10:07 by ADMIN

Starting from a Grid's "endless scrolling demo" on: https://demos.telerik.com/kendo-ui/grid/endless-scrolling-remote

Edit grid configuration to set smaller page size. All items of the first page need to be visible on the screen plus some free space. A grid height needs to be set. See this DOJO: https://dojo.telerik.com/amiNohIx

The vertical scroll bar is disabled and there is no way to get/see next pages of data.

Interesting is that use of the horizontal scrollbar (if one is available) starts some background operation (looks as data page load) and then the vertical scrollbar is OK.

Unplanned
Last Updated: 06 Mar 2020 09:37 by ADMIN
Created by: Iggy
Comments: 1
Category: Grid
Type: Bug Report
0

Dear support,

I've found a bug in kendo ui grid concerning the combination of grouping, multi-column headers and showing/hiding columns. To reproduce the issue, please use the "Multi-column headers" demo on your kendo ui demos page. Now please use the column menu to hide both child columns of the 'Locatiion' column header ('Country' and 'City'). Now please group the data by the column 'Contact Title'. If you now use the column menu to show one of the previously hidden columns (e.g. 'Country'), you will see that it is shown at the wrong position (left site, index 0).

I've attached an image showing the issue.

 

Kind regards

Iggy