Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

262
Visualizações
Reset form using AvForm in react js

I am using AvForm in React js. I want to reset the form after form Submission. But I am unable to reset the code unless I refresh the whole page. Whenever the form submits it retains the old value but not reset the fields

form.js

<AvForm
    className="form-horizontal"
    onValidSubmit={(e, v) => {
      const data = { ...formData, ...v };
      setFormData({ ...data });
      dispatch(
        createMarketplaceAccount(
          {
            name: data.name,
            access_id: data.access_id,
            access_secret: data.access_secret,
            marketplace: "amazon",
            aws_credentials: {
              marketplaces: data.marketplaces.split(","),
            },
            account_id: getUserInfo().account_id,
            informed_api_key: data.informed_api_key,
          },
        ),
      );
      toggleTabProgress(3);
      toggleTab(3);
    }}
  >
    <div className="form-group">
      <AvField
        name="access_id"
        label="Amazon Seller ID:"
        value=""
        className="form-control"
        placeholder="ABC123DE456F78"
        type="text"
        required
      />
    </div>
    <div className="form-group">
      <AvField
        name="access_secret"
        label="MWS Auth Token:"
        value=""
        className="form-control"
        placeholder="amzn.mws.123e4567-e89b-12d3-a456-426655440000"
        type="text"
        required
      />
    </div>

    <ul className="pager wizard twitter-bs-wizard-pager-link">
      <li
        onClick={() => {
          toggleTabProgress(1);
        }}
        className="btn btn-primary w-md btn-sm waves-effect waves-light"
      >
        Previous
      </li>
      <li className={activeTabProgress === 4 ? "next disabled" : "next"}>
        <button type="submit" className="btn btn-primary w-md btn-sm waves-effect waves-light">
          Next
        </button>
      </li>
    </ul>
  </AvForm>

I need help. Thank you in advance. I need some suggestions

over 4 years ago · Santiago Trujillo
2 Respostas
Responde à pergunta

0

You can get the ref from AvForm and use reset()

 class Whatever extends React.Component {
    constructor(props){
    super(props);
    this.handleValidSubmission = this.handleValidSubmission.bind(this);
 }
  
  handleValidSubmission (event, fields) {
    //  do your thing
    this.form && this.form.reset();
  }

  render() {
    return (
      <AvForm onValidSubmit={this.handleValidSubmission} ref={c => (this.form = c)}>
        ...
        Your form fields here
        ...
      </AvForm
    )
  }
}
over 4 years ago · Santiago Trujillo Relatório

0

Hassam use the concept of states and set the state to empty whenever it is required and assign that state to the value property of field

over 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda