Hi,

 I am using Kendo react autocomplete search box in our project. (import { AutoComplete } from "@progress/kendo-react-dropdowns";)

 Whenever user starts typing in search textbox its shows best match from results highlight with box border. I want to remove this heighlight from best match which in middle of search result and  when user starts navigating using keyboard it should start from 1st item in search results. Is there any way to achieve this ?

Also for filter I am using operator: "contains", Is there any way to order result of filter as best match on top and then rest of matches.

I have a need to refresh a currently displayed KendoReact Grid with the latest data coming from the server (i.e. real time changes made by others). Is this possible currently with KendoReact's Grid component? If so, is there a demo that I can review the code to gather how to do this?

Thanks.

Jim Minnihan

SKF, Inc.

Anyone know how to do a name validation when I upload the files. Not the extension. 

<Upload
batch={false}
multiple={true}
defaultFiles={[]}
withCredentials={false}
restrictions={{
allowedExtensions: ['.xlsx', '.xls']
}}
saveUrl={'https://demos.telerik.com/kendo-ui/service-v4/upload/save'}
removeUrl={'https://demos.telerik.com/kendo-ui/service-v4/upload/remove'}
/>

Thank you Very much

I have a zoomable Kendo React Chart where I have set a maximum on the . If the user zooms in and zooms out that max is lost.

In my particular use case, I have 2 series each with their own . The second series should really always be shown on a scale from 0-3. To do this I have set a max on the second Y axis to 3 but this is lost as soon as the user zooms.

I do want the user to be able to zoom but when they zoom back out I expect the user to be able to return the chart to its initial state of having a max of 3 on the . 

This  show this behavior: https://stackblitz.com/edit/react-l5udtx

Is there a recommended way to achieve this?

Hello,

We have a need to recreate the grid entirely when user selects an option from a dropdown. Both columns and data will be different.

Currently, I have tried updating the datasource being passed to the grid, but the old columns still remain.

Is it possible to get a demo on how to do this with the React grid version? This is a common use case.

Your help is appreciated,

Mihai

Hello,

When I put a DropDownList inside a Window, and the I try to select an item, it seems that the deployed list is rendered behind the window. For your convenience, I have set up a demo on Stackblitz. I am using 2.7.1 kendo react version.

Best regards,

Jean-Pierre

I'm attempting to use a kendo React ComboBox and implement filtering, but the onFilterchange event isn't firing when I type info into the search, just the OnChange event when I select an item from the full dropdown list.

function MyComponent(props) {
const { value, data } = props;
const [filteredData, setFilteredData] = useState(data);
const handleChange = (e: ComboBoxChangeEvent) => {
const value: any = e.target.value;
if (value === null || typeof value === 'string') {
props.onChange(value);
} else if (typeof value === 'object') {
if (value.hasOwnProperty(props.valueField)) props.onChange(value[props.valueField]);
} else {
props.onChange(e);
}
};
const filterChange = (e: ComboBoxFilterChangeEvent) => {
setFilteredData(filterBy(data, e.filter));
};
return (
<KendoComboBox
style={{ width: '100%' }}
data={filteredData}
textField={props.textField.toString()}
onChange={handleChange}
onFilterChange={filterChange}
disabled={props.disabled}
name={props.name}
placeholder={props.placeholder || ''}
suggest={true}
value={(value && data.find(d => d[props.valueField] == value)) || value || ''}
itemRender={props.itemRender}
onBlur={props.onBlur}
/>
);
}

Is there a suggested way for handling required fields in In-line Grid Editing?  Currently we are handling required fields by using custom cell renders and applying styles manually.  Unlike the jQuery solutions where a required tag can be set in the model, this solutions seems clunky.

On an unrelated note ;),  is there a reason whey the DateRangePicker doesn't have a required attribute like the DatePicker?

We’re currently trying to make our website compliant with the WCAG standards, and right now it fails a few of the requirements. I'm wondering if these are problems with the Kendo grid itself or if you can help us debug something we're doing wrong in our implementation.

One issue was with checkboxes, which don’t seem problematic when I run an audit on the example, but did present issues when we used the same technique to add them in our own grid:
https://www.telerik.com/kendo-react-ui/components/grid/selection/

The other issues were with filters. This is the example that we referenced when adding filters to our code, which was a similar situation (no issues when we audit the example page, but shows issues when we audit our website):
https://www.telerik.com/kendo-react-ui/components/grid/filtering/

 
This is the breakdown of issues I came across:

Issue 1: Form elements must have labels - checkboxes
As I mentioned above, we added checkbox selection to the table following this example: https://www.telerik.com/kendo-react-ui/components/grid/selection/

However, we're seeing "form elements must have labels" issues on all of the checkboxes when we run an audit.

Issue 2: invalid values for 'aria-owns' and 'aria-activedescendant' attributes on filters
This problem applies to each of the built-in filter dropdowns (I added filtering following the example linked above).
The attached image named issue2 has a more detailed breakdown of this issue, but TLDR: the validator says the issue is that "the aria-owns attribute must point to an element in the same document"

Issue 3: Form elements must have labels - inputs for filters
The attached image named issue3 has a more detailed breakdown of this issue.

Issue 4: Form elements must have labels - filter dropdowns
The attached image named issue4 has a more detailed breakdown of this issue.

-----------------------------------------------------------------------------------------------------------
Things I’ve already tried:
I tried upgrading Kendo to the latest version via npm (https://www.npmjs.com/package/@progress/kendo-react-grid) to see if the problems were fixed, but my audit showed me the same issues I had seen and more (this time issues with column titles).

Relevant parts of the code:
I edited out some helpers, handler functions, column setups, etc that don’t seem relevant. Please let me know if there's something else you want to see!