As the FilterInputWrapperComponents set currentOperator(value: string) uses a hard coded list of operator values (isnull isempty isnotnull isnotemty), it is impossible to create a custom FilterOperator that has no search string - so we can't have isnullorempty isnotnullorempty (or isblank/isnotblank).
Please introduce a requiresSearchValue on the FilterOperatorBase class and make sure FilterInputWrapperComponents does decisions based on that.
Please introduce a isnullorempty/isnotnullorempty filter operator (for strings).
Additional context/sample usage:
<kendo-grid-column title="Employee / Prospect" field="Name" width="160">
<ng-template kendoGridCellTemplate let-field let-value let-dataItem>
<span *ngIf="dataItem.IsProspect" class="pull-left">{{dataItem.Name}}
<p class="prospect-indicator pull-right" data-letters="P"></p>
</span>
<span *ngIf="!dataItem.IsProspect">{{dataItem.Name}}</span>
</ng-template>
<ng-template kendoGridHeaderTemplate let-column>
<span title={{column.title}}>{{column.title}}</span>
</ng-template>
<ng-template kendoGridFilterMenuTemplate let-filter let-column="column" let-filterService="filterService">
<kendo-grid-string-filter-menu
[column]="column"
[filter]="filter"
[filterService]="filterService">
<kendo-filter-eq-operator></kendo-filter-eq-operator>
<kendo-filter-neq-operator></kendo-filter-neq-operator>
<kendo-filter-contains-operator></kendo-filter-contains-operator>
<kendo-filter-not-contains-operator></kendo-filter-not-contains-operator>
<kendo-filter-startswith-operator></kendo-filter-startswith-operator>
<kendo-filter-endswith-operator></kendo-filter-endswith-operator>
<kendo-filter-isblank-operator></kendo-filter-isblank-operator>
<kendo-filter-isnotblank-operator></kendo-filter-isnotblank-operator>
<kendo-filter-isempty-operator text="xIs blank"></kendo-filter-isempty-operator>
<kendo-filter-isnotempty-operator text="xIs not blank"></kendo-filter-isnotempty-operator>
</kendo-grid-string-filter-menu>
</ng-template>
</kendo-grid-column>
Please provide a how-to example that demonstrates how to move from one cell to the other using "Tab" in an editable Grid with virtual columns.
When there are more columns than are visible within the viewport the columns are virtualized which is expected.
However, when editing a row and we want to tab through the fields, we can only tab through the fields that are in the viewport and once we tab from the last viewport field our focus leaves the grid entirely and we cannot navigate to the remaining fields at all.
Thank you.
Hi,
It will be an excellent enhancement to the Grid component if cell mouse enter/leave events are added, providing the dataItem(other information like rowIndex and columnIndex might also be useful) on the current hovered cell.
Thank you for your consideration.
Currently the Grid checkbox column selection does not allow for selecting a range of rows via shift-click.
As this seems to be a behavior that users expect, based on a similar experience with popular applications like for example Outlook and Gmail, we can consider introducing this behavior in the Grid too.
For example:
When we click on a check box and Shift+click on another checkbox all the rows in between these rows should be checked. Ex: click on 2nd row and shift click on 8th row, all the rows in between 2nd and 8th should be selected.
Please provide support for spanned columns with multi-column headers combining the already existing features:
https://www.telerik.com/kendo-angular-ui-develop/components/grid/columns/spanned/
https://www.telerik.com/kendo-angular-ui-develop/components/grid/columns/headers/
The developer must measure the Grid row height in the browser and set it to the `rowHeight` in order for virtual scrolling to work correctly. Setting an incorrect value can lead to subtle errors - glitches during scrolling or inability to scroll down to the last row.
The row height may change as a result of a styling adjustments and is not guaranteed to be identical across browsers and devices. This makes the current workflow tedious and error-prone.
One of the following approaches can be used to solve this issue:
Overcoming the last listed limitation would be nice:
https://www.telerik.com/kendo-angular-ui-develop/components/grid/columns/locked/#toc-known-limitations
The Spreadsheet (Google Docs, etc.) addresses this situation by duplicating the cell content on both sides and clipping the right cell accordingly.
Currently, the Selection feature behaves strangely with the Keyboard Support enabled, see [demo](https://plnkr.co/edit/hTOg7Flx5Fnm63jJ6CgX?p=preview):
* Enter, Ctrl+Enter and Shift+Enter select the rows, but do not function if the cell has focusable components
* Space works only on the checkbox column
* Ctrl+Space, Shift+Space do not work at all
Ideally, the Grid should support the following shortcuts when the Selection and KB Navigation are enabled:
* Select the current row on Space, regardless of the cell content
* Support Ctrl and Shift modifiers for Space
* Shift + Up/Down Arrow for adding/removing the next/last row to the selection.
Similar to the TreeList KB navigation:
https://www.telerik.com/kendo-angular-ui/components/treelist/keyboard-navigation/
Currently the Grid Filter menu logic is "and" and there is no built-in option for changing it even when using the configurable filter menu components in the Filter menu template.
It would be nice having an option to configure the default logic as well as to limit the list of options to only "And"/"Or" or prevent the end user from changing the programmatically set filtering logic.
As a workaround for setting the initial logic, the developer can use the logicChange method, e.g.:
https://www.telerik.com/forums/default-filter-menu-logic#4935605
Hi, the following steps to reproduce the problem:
As you can see, the three dots menu of the not ticky columns are not hidden when overlapped by sticky columns.
Best regards,
Alessandro
Could we have a turnkey solution which allows to disable a row selection which takes care of disabling only the relevant selection checkboxes and handle properly the "Select all" checkbox state (in header).
With CheckboxColumnComponent field which allows providing dataItem field name or predicate function.
<kendo-grid-checkbox-column showSelectAll="true" disableSelection="isDisabled">
</kendo-grid-checkbox-column>
<kendo-grid-checkbox-column showSelectAll="true" [disableSelection]="isDisabledPredicateFunction">
</kendo-grid-checkbox-column>
OR
If you don't want to add more selection concerns into CheckboxColumnComponent this field could be specified in your SelectableSettings as well:
public selectableSettngs: SelectableSettings = {
enabled: true,
checkboxOnly: false,
mode: 'multiple',
cell: false,
drag: false,
rowEnabled: mySelectableRowPredicateFunction
}
rowEnabled field could something like this:
export declare type RowEnabledSelectionFn = (context: RowArgs) => boolean | boolean;
export interface SelectableSettings {
//...
/**
* Determines if row selection is allowed.
*
* @default true
*/
rowEnabled?: RowEnabledSelectionFn;
}
Thank you
Hi
we have a lot of clients requesting two features for the KendoGrids:
1st) A second horizontal scrollbar on top of the grid, scrolling smoothly in parallel with the bottom one.
2nd) Sticky / fixed headers to be able to always see the header row. Somethine like this: https://www.telerik.com/kendo-angular-ui/components/grid/columns/sticky/ but for the top labels row.
Hi Kendo Angular team,
It will be a nice improvement if there is an option to set a specific type for the Grid data item and the templates. This will allow checking the types inside the templates when fullTemplateTypeCheck is on.
There is a bug with the kendoGridGroupBinding directive when changing the input data and using virtual scrolling. If you have many rows and scroll down to a lower virtual page and then change the input data to a small subset the grid will think there is no data. And if you then change back to the full data set you have to start scrolling down before the grid repaints with data.
Reproduction available here https://tyb2ys--run.stackblitz.io
Steps:
1. scroll down halfway in the grid
2. click the "Show subset" button. Note the grid shows the no records message but should show three rows
3. click the "Show all" button. Now the grid shows the scrollbar and the no records message is gone but it is not showing data. You have to scroll down past where you previously were with all data before it repaints the rows
One workaround is to have an ngIf on the grid to destroy and recreate the grid when the input data changes, something like this:
When a Grid cell is focused, and after this, the data is filtered so that the data contains fewer items than the index of the row the last focused cell was in, the Grid table area does not receive focus when tabbed into.
Please check the example:
https://stackblitz.com/edit/angular-xqswy5-zqeqkb?file=app/app.component.ts
When resizing grid columns so the last column does not reach the right border of the grid (sum of columns width < current grid width), loading stored state (or changing column width property in any way) does not restore the columns width proportionaly to use the full width of the grid.
Note: in this case, the default columns width sum and stored state columns width sum are always inferior to the grid width in order to use proportionality and adapt to every screen size.
In our implementation, we made a "Reset columns view" (working exactly as the loading store data), but if the user play arround with the columns as described above), the reset is broken.
Reproduce steps:
Using the persisting state exemple available in the doc: https://stackblitz.com/edit/angular-3jdmzy?file=app%2Fapp.component.ts
- Click "Save current state"
- Resize grid columns so the last column does not reach the right border of the grid
- Click "Load saved state", the columns are resized proportionaly of the saved state but on the base of previous columns width sum instead of the full grid width.
Essentially the most basic GridComponent when ngIf'd in and out will not be collected -- apparently because of orientation change / resize change listeners not being appropriately removed.
Steps to Reproduce
Click the TOGGLE TABLE button to hide the table
Click the TOGGLE TABLE button to show the table
repeat several times
Take a memory snapshot
There will be HTMLTableRowElement items that grow each iteration of toggling the table.
The HTMLTableRowElements retention shows that they eventually lead to a resize listener, or an orientation change listener.