Hello,

Is there a way to get the data item from the autocomplete list on a selection event? Right now from my research there is no onSelected event. There is one in the kendo jQuery implementation but nothing for a react implementation. Sure I could use the onChange event but this only fires when the value in the input box changes. There is no way I can identify that the user has selected the value from the list. I can make my own selection event but I would like to avoid this. Please let me know if there is something I am missing concerning this component. I tried using a combo box component as well, still was unable to find the selection event or an easier way to acquire a selected item.

Below is my current implementation, any assistance would be great. Thanks.

const mapStateToProps = (state: ApplicationState) => ({
    ...state.accountsStateSlice
});
type TypeAheadSearchProps = ReturnType<typeof mapStateToProps>
    & {
        data: Array<any>;
        textField: string;
        apiRequestThunk: (...params: any) => (dispatch: redux.Dispatch<redux.AnyAction>) => Promise<void>;
    }
type AutoCompleteState = {
    data?: Array<any>;
    value?: string;
    loading?: boolean;
}

const TypeAheadSearch = (props: TypeAheadSearchProps) => {
    const [autoComplete, setAutoComplete] = useState<AutoCompleteState>({
        data: props.data,
        value: '',
        loading: false
    });

    const onChange = (event: any) => {
        const value = event.target.value;
        if (value.length > 2) {
            props.apiRequestThunk(value, true);
        }
    }

    useEffect(() => {
        setAutoComplete({
            data: props.accounts,
            loading: false,
        })
    }, [props.accounts])

    return (
        <AutoComplete 
            data={autoComplete.data}
            value={autoComplete.value}
            onChange={onChange}
            loading={autoComplete.loading}
            textField={props.textField}
        />
    )
}
export default connect(mapStateToProps, null)(TypeAheadSearch);

Hi,

I need In-Cell editable grid but it must be able to switch between cells with a tab. Is to possible to reuse In-Cell editable grid https://www.telerik.com/kendo-react-ui/components/grid/editing/editing-in-cell/ or do I need to do it with custom cells?

I'm using kendo react grid grouping feature to group datas in grid.The problem is i'm not able to expand or collapse the group.

Here is my code....

https://stackblitz.com/edit/react-ryuhdv?file=index.js

When I add onBlur and onFocus with setStates to datePicker in the blitz demo provided for the component I was able to create an infinite loop  with this code 

https://zvfckz.run.stackblitz.io/

-Steps to reproduce with following code, click outside component of opened one so they are all close
-Click on Format and WeekColumn calendar icon to have it open and then click Default Show(edited) icon and this will create an infinite loop

This create a setState loop but I am curious to why as these component are separate.

I have a stack bar chart, and i need to apply the following changes to it:

1. The ChartValueAxisItem horizontal major unit lines need to be displayed above the bars rather than beneath them
2. For each bar, I need to add in some text.  If the bar has a value of 3, then 3 text values equally spaced out will need to be added in that bar

A before and after diagram of what is needed is attached

What is the best approach to achieve this?

Is it possible to add floatingLabel to DateTimePicker?

It is a very cool feature but If one of the fields on the form does not have it. it will not look nice.

Is the a way I can add it myself?

After studying the API for a Window KendoReact component, is there a way to implement either:

1) The Draggable features on a Dialog component that is overlaid on top of a Kendo React Grid component.

2) The Dialog smoke underlayment for a Window component that is overlaid on a Kendo React Grid component.

In other words I would like a draggable Dialog, or a draggable Window that looks like a Dialog implementation.

Is there anyway either of the above are possible? And if so, do you have an available example of its implementation?

Thanks,

James

SKF USA, Inc.

Hi - Is there any way to make a Kendo React Editor disabled or read-only based on any condition?

Basically I want the users to see the content of the editor, but not being able to edit the contents.

TIA.