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.
Hi, Kumar,
Thank you for the provided code.
I created a StackBlitz example based on it, however, I was not able to reproduce the faced issue. Therefore, can you please update it until the issue is reproducible? Here is my test demo:
- https://stackblitz.com/edit/react-5u2z3w?file=app%2Fmain.jsx
Regards,Wissam
Progress Telerik