Source:  Twitter logo

I had a condition if the two textfield are the same it will proceed, if not then the button is disabled. I know I'm doing this wrong.

onSubmit() {
        debugger
        if  (this.state.password == this.state.password2)
            alert('same');
        else 
            alert('error');
            this.disable;
}

First, dont check onSubmit but on change (you dont want to disable it AFTER it was submitted) for both your input. Add a state value for your disabledButton, and set it to false only if both input are the same (in the onChange event).

You can set disabled button inside your JSX like this

<button disabled={this.state.disabledButton} />
4 users liked answer #0dislike answer #04
Nevosis profile pic
Nevosis

You can do that in your render function:

render() {
  const submitDisabled = this.state.password !== this.state.password2

  return (
    // ...
      <button disabled={submitDisabled}>Submit</button>
    // ...
  )
}
1 users liked answer #1dislike answer #11
CodinCat profile pic
CodinCat

This will work Perfect. Try this

render() {
  const submitDisabled = password.length > 0
  return (
    // ...
      <button disabled={submitDisabled}>Submit</button>
    // ...
  )
}
0 users liked answer #2dislike answer #20
Ganga profile pic
Ganga

Copyright © 2022 QueryThreads

All content on Query Threads is licensed under the Creative Commons Attribution-ShareAlike 3.0 license (CC BY-SA 3.0).