I want to add a custom combobox with filtering in incell grid editing.  I followed this example. But filtering is not working. Please help

• https://stackblitz.com/edit/react-5l9wj4?file=app%2FmyDropDownCell.jsx

HI there,

 I am trying to build custom combobox which offers Add text inputbox, refer the pic for the reference,

with the help of below  example code.

					<ComboBox
						style={{
							width: '180px',
						}}
						id='newx'
						name='newX'
						textField='add new data'
						value={value}
						data={selectedval}
						onChange={(e) => handleChange(e, props)}
						header={
							<span
								style={{
									marginLeft: '60px',
								}}
							>
								<form className='k-form' onSubmit={(e) => e.preventDefault()}>
									<fieldset>
										{/* <div>Name</div> */}
										<TextBox
											value={selectedval}
											onChange={handleChangeval}
											// placeholder='John Smith'
											suffix={() => (
												<>
													{/* {value !== EMPTY_VALUE && ( */}
													<InputClearValue
														onClick={handleAddoperation}
														className={styles.plus}
													>
														<SvgIcon icon={plusIcon} />
													</InputClearValue>
													{/* )}
													 <InputSeparator /> */}
												</>
											)}
										/>
									</fieldset>
								</form>
							</span>
						}
						// footer={
						//   <span
						//     style={{
						//       marginLeft: '60px',
						//     }}
						//   >
						//     footer
						//   </span>
						// }
					/>

Issue encountered:

1. when i click on text input box inside combobox, options  popup closing. ( means i am not able to type or add new contents in text input box) 2. i am trying to implement this with incell. is there any other things to consider wrt Incell edit.

Problems with the "Field > Combobox" component when passing all the data, label and component properties to it, no problem, but when I add "textField" the combobox gives me a list of [object Object]. Maybe I'm passing the properties wrong, could you give me some clue? 

I have the list of "moneda" that is passed in data through the API.

In the attached image you can see that it loads the list with the value of 'CLP' which is correct and you see the [Object object] list. Greetings

   const [currency, setCurrency] = useState([]);

   useEffect(() => {
     (async() => {
       const currency = await getDefiCurrencies();

       setCurrency(currency);
     })();
   }, []);

---------------Edit Form --------------------------
                   <Field
                     id={'CodiMone'}
                     name={'CodiMone'}
                     label={'Currency'}
                     component={FormComboBox}
                     // textField={'CodiMone'}
                     data={currency}
                   />

I am trying perform inline edit in the grid. when the grid is in edit mode, i want to have a custom combobox cell. I got the values in the combobox also. but the selected value is not flowing to the grid when i click on update button.  The values in the combo box is key value pair.

I followed the first example in the link:      https://www.telerik.com/kendo-react-ui/components/grid/editing/editing-custom/

Hello,

I am building a component in React and need to add a custom icon to the right of the autocomplete component. By default, it has a "x"  icon, but I would like to have a search icon in there. 

Can you tell me if this is natively supported by the Kendo autocomplete component ?

Here the links:

Autocomplete: https://www.telerik.com/kendo-react-ui/components/dropdowns/autocomplete/

Props: AutoCompleteProps - React Dropdowns Library - KendoReact API (telerik.com)

An image is attached that shows what is the expected behavior of the component, but we do need to have a box below the input as the autocomplete comp. does. 

I'm trying to concatenate two values into the textField property for FormComboBox, but it doesn't allow me. Instead I get an error:

Uncaught runtime errors:
ERROR
_utils__WEBPACK_IMPORTED_MODULE_2__.getItemValue(...) is undefined

My code is below. Perhaps someone can help?

<Field
	key={'personU'}
	id={'personU'}
	name={'personU'}
	label={'U'}
	textField={'abc' + 'def'}
	dataItemKey={'uic'}
	placeholder={'U...'}
	component={FormComboBox}
	allowCustom={true}
	data={units}
	virtual={{
		total: uCount,
		pageSize: uPageSize,
		skip: page
	}}
	onPageChange={pageChange}
	/>

 I've tried the following:

textField={'abc' + 'def'}

textField={`${abc} ${def}`}

Hi,

When a combobox has virtualization enabled. If an item's text is too long, instead of wrapping the line, it is now showing ellipsis. I am guessing it wants to keep a fixed height for every item for virtualization purpose. Is there a way to show the full text if its overflowed? For example, show a tooltip when mouse over the item?

Thanks,

Jie

I tried overriding the z-index of the k-animation-container class, but I wasn't successful. What can I do to proceed with this idea?

Gabriel.