Hello,
With a grid configured with the Search, if a search is carried out with pre-existing filters on non-searchable columns, the pre-filtered columns are cleared in the search result.
Consider a basic grid as per the following Dojo:
https://dojo.telerik.com/axuFURen
It is configured to search on one column - name.
I can filter on the age, to show those aged 33
With the age filter applied, I then want to search that dataset, so I enter a value in the search control.
The result is that I only get the data filtered on the search input - the age filter has been cleared.
Summary
The search control should be configurable to either combine or ignore other filters.
You guys do such a great job of allowing us to extend your product for our needs. And I know that you have recently added the Search Panel to allow us to perform a search against the dataSource. However, I would like to put that search box/button somewhere else completely on my page.
I've been able to get around this by using the code in kendo.grid.js to use my own click/keypress events to invoke the filter based on the new search options.
configureSearch takes two jQuery selector strings to hook into click/keypress events. I only want to search when the user hits ENTER instead of after each keypress. Then it executes the private search function.configureSearch(inputSelector: string, clickSelector: string) {
const searchFn = this.search;
if (this.grid.options.search == null) {
throw "search field(s) not set for grid.";
}
const inputElement = $(inputSelector).keypress(function (this: HTMLElement, e) {
const keycode = (e.keyCode ? e.keyCode : e.which);
if (keycode === 13) {
searchFn($(this));
}
});
$(clickSelector).click(e => {
searchFn(inputElement);
});
}
private search(inputElement: JQuery<HTMLElement>) {
const options = this.grid.options;
const dsOptions = this.dataSource.options as kendo.ui.GridScrollable; // HACK: dataSource.options isn't really a GridScrollable, but it's similar
let searchFields: string[] | any = options.search ? options.search.fields : null;
let expression: kendo.data.DataSourceFilters = {
filters: [],
logic: "or"
};
const value = inputElement.val();
if (!searchFields) {
searchFields = getColumnsFields(options.columns);
}
// NOTE: Thankfully we don't use endless
if (dsOptions.endless) {
dsOptions.endless = null;
//(this as any)._endlessPageSize = this.dataSource.options.pageSize;
}
if (value) {
for (let i = 0; i < searchFields.length; i++) {
expression.filters.push({
field: searchFields[i],
operator: "contains",
value: value
});
}
} else {
expression = {};
}
this.dataSource.filter(expression);
// from Telerik:
function leafColumns(columns: kendo.ui.GridColumn[]): kendo.ui.GridColumn[] {
/* Hiding ... go see Telerik source code */
}
function getColumnsFields(columns: kendo.ui.GridColumn[]): string[] {
/* Hiding ... go see Telerik source code */
}
}
Hi,
I raised a forum support ticket for hiding the scrollbar when the data rows is <= pagesize. https://www.telerik.com/account/support-tickets/view-ticket/1493109
The response was to set the scrollbar overflow to auto and padding removed which caused overlapping of the scrollbar with the last column when visible.
Feature is requested to have this feature inbuilt with Grids having Virtual Scroller to avoid it.
Thanks
Devna
We would like to add a new column(s) dynamically to a grid, This feature is very important when grid containts lots of fields. In order to resolve slow grid rendering, we are allowing user to choose columns to show/hide and render grid accordingly. Kendo generates html code for hidden columns which causes slow rendering for large data. We are already using performance improvement suggestions from kendo like virtual scrolling, paging etc.
I'd like the ability to choose the behavior of mutli-row selection on a virtual grid with persisted selection.
For purpose of example, assume we have a virtual grid with 50 rows (pager controls not shown), a page size of 10, and persisted selection.
1. Select row 1 on page 1.
2. Scroll down to trigger page 2 to load (rows 11-20).
3. Select row 11, page 2.
4. Current Behavior: Both row 1 and row 11 remain selected.
5. Desired Behavior: Only row 11 remains selected.
Reasoning: I believe that a virtual scrolling grid should have selection behavior identical to a single page. That means that the only way to add rows to the selection is holding down control/shift during selection. In other words, on page 1 of the above example, if I select row 1, then row 2, only row 2 remains selected. If I select row 1, then Ctrl+click/Shift+click row 2, both remain selected. For virtual scrolling where multiple pages are displayed fluidly as if a single page, it seems odd to have the selection behave differently.
We need the ability to merge grid rows with the same values (see attached). This is a feature our customers have come accustom to with our Windows UI and the Developer Express toolkit. I understand I can manipulate the rowTemplate to achieve similar results but it is my understanding this will cause issues with row selection, editing, etc... Is this something that can be introduced in the future?
Regards,
Bracken
We are working on enterprise product, which uses Progress Telerik jQuery KendoUI components extensively purchased by our Company. In which Kendo grid is used in many modules of our product.
Now a days we are working on Accessibility (i.e. keyboard and screen reader) as part of out-of-box feature of our product.
The grid has been made accessible so that it can be navigated using the keyboard arrow keys, once it receives focus via Tab Key in order of tab index or Alt + W short cut key. In turn, this has spawned up one issue in terms of keyboard operatibility. You can now tab into the grid, use arrow keys to navigate to the cell containing action buttons and then again tab to the button that you want to activate.
This is causing confusion in terms of use of the tab key. Ideally, the tab should take focus from one widget to another. That is the tab key should have taken focus into the grid and pressing it again should have navigated away from the grid. But because of the action buttons displayed within the grid for each record, that tab also navigates controls within the grid widget. This causes numerous press of the tab key just to traverse past the grid widget.
Now due to this, user needing to press the tab key multiple times is an accessibility issue.
Also while referring Grid control demo on https://demos.telerik.com/kendo-ui/grid/editing-inline , we found the same type of behavior when traversing through “Edit” and “Delete” buttons. One of the code snippet developed by us using dojo.telerik.com can be referred on https://dojo.telerik.com/@chiragvidani/ulOzaniX/2
It would be great if this issue is addressed with a good accessible way.
Please find below reply received from on the accessibility forum, when we tried raising the issue to find out the remedial solution:
Reply 1 by "Glen Walker"
Just to make sure we're talking about the right type of component, a grid vs a table, a grid is like a spreadsheet where you can interact with all the cells. I agree that a grid should be a single tab stop so that you can easily navigate to the elements after the grid. However, I have seen implementations that once you're in the grid and in "edit mode", you can tab amongst the cells. This is helpful if the cell contains an element that uses the arrow keys (such as a radio or select) and you want the arrows interpreted by the element and not navigate to the next cell. You then need to get out of "edit mode" (perhaps via the escape key) in order to tab off the grid.
A table, on the other hand, doesn't let you interact with the cell directly but that doesn't mean a cell cannot have an interactive element. That is, you can have links or buttons or inputs in a table cell and it'd still be considered a table and not a grid. It's kind of a fine nuance. A grid lets you interact with the cell itself and a table might let you interact with an element that is in the cell, but not with the cell itself.
There is, of course, more to this than that but I was trying to keep it basic and simple.
So, that being said, do you really have a grid or a table?
Let's say you really have a table instead of a grid, and that one of the cells in your table has several buttons, and that pattern is repeated on every row. You would indeed have a bunch of tab stops, making it difficult to navigate beyond the table.
One possibility is if all the button actions are grouped together, they could be considered a toolbar. A toolbar is one tab stop and you arrow between the buttons, but you'd still have the problem of having a toolbar on every row. A toolbar would reduce the number of tab stops compared to having all separate buttons but you'd still have X number of tab stops for X rows. One for each toolbar.
Maybe a grid in that case would be better. Tab to the grid, tab again to whatever element follows the grid. Tab back to the grid and use the arrow keys to navigate to the desired row. Maybe the row goes into "edit mode" automatically when it receives focus with the arrow and then all the interactive elements in the row get a tabindex of 0.
That might be a bit non-standard and there probably isn't a good "role" to explain the behavior. A bit of usability testing might be required.
Thanks,
Chirag Vidani
It would be nice if additional template variables where available, the only two: pageNum & totalPages are not enough.
Consider Time of Day & Filename at a minimum.
https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/pdf.template
Hallo,
i have a grid with a lot of data for a better representation i show some related values with a template in the cell below each other.
This solution is not optimal because I don't have the filter and sort function in the column header for every single field.
Enclosed an example https://www.igniteui.com/grid/multi-row-layout which illustrates my wish.
I would be happy if you implement this feature in a future release.
With the latest version, we could see extra options in Grid filter. Is there any way by which we can make it configurable?
Add "matches" operator (Regular Expression) both on FilterCell as well as on Filter Menu for strings. Implementation should take into account Javascript rules for Regular Expressions.
Currently grid takes proxy url in excel option in grid. I want proxyTarget parameter in the excel options some thing like this. excel: { proxyURL: "/save" proxyTarget = "_blank" } So user can open exported excel in new tab inside IPAD. This option exist in kendo.saveAs() function and export to excel function also calls the saveAs function but becuase currently this parameter is not defined in excel options so proxyTarget parameter goes undefined. Adding that option in grid will let user to open exported excel in new tab for IPAD where direct download is off.
Drag fill multiple cells like excel. Kendo Spreadsheet control already has it. This is a crucial feature missing from versatile grid , IMO
At the moment, Remote Validation on the grid does not work with incell editing. I would like to see this restriction removed. Normal validation works with incell editing; however, the remote does not. I should not have to change the appearance and functionality of the grid from incell to to inline just because the standard validation is insufficient. I appreciate that this is not an easy change, but hope you are able to give it some priority.
The grid "beforeEdit" event is designed, as per documentation, "for preventing the editing depending on custom logic". However, this event provides only information about the edited row, not cell, which severely limits what that logic can do. A related event, "edit", passes information about the container, which is a table cell in incell mode. There is no reason for "beforeEdit" not to do the same - both event are triggered merely several lines apart.