Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

189
Vistas
Rendering text of one input field to another in Ant Design

I am using ant design and I have 2 input fields Enter Example and Select Value now when I select text from Enter Example the selected text should get rendered inside the Select Value field

For selecting the highlighted text I am using window.getSelection().toString() and when I console I am getting the selected text value but how can I display that inside the Select Value Input Field

Problem :- How to render the selected text of Enter Example Input Field inside Select Value Input Field

What I have tried :-

const ExampleComponent = (props) => {
const [exampleValue,setExampleValue] = useState('')
const handleMouseUp = () => {
    const selectedTextValue = window.getSelection().toString()
    setExampleValue(selectedTextValue)
    console.log(selectedTextValue)
  }
return (
        <Form
          form={form}
          labelCol={{ span: 7 }}
          wrapperCol={{ span: 10 }}
          layout="horizontal"
          colon={true}
          onFinish={onFinish}
          size="large"
        >
<Form.Item
            label="Enter Example"
            name="example_name"
            className="csi-ant-form-item"
            hasFeedback
            rules={[
              { required: true, message: "This Field Cannot be Empty!" },
              ({ getFieldValue }) => ({
                validator(_, value) {
                  if (value.length < 4) {
                    return Promise.reject("Length too short");
                  }
                  return Promise.resolve();
                },
              }),
            ]}
          >
            <AutoComplete>
              <Input allowClear onMouseUp={handleMouseUp}/>
            </AutoComplete>
          </Form.Item>
<Form.Item
                label="Select Value"
                name="entity_value"
                className="csi-ant-form-item"
                hasFeedback
                rules={[
                  { required: true, message: "This Field Cannot be Empty!" },
                ]}
              >
                <AutoComplete>
                  <Input placeholder="Select Value from Example" value={exampleValue}/>
                </AutoComplete>
              </Form.Item>
</Form>
)
}

I am trying to display the highlighted text using the value prop like value ={exampleValue}

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda