What is the correct way of disabling the button when it contains empty string or spaces

Question

I have a form for user information and if one of the fields are empty I want to disable the submit button but my setState is not updating the flags. Here is my validateFields function which is being called inside a build method. Regex is 100% correct (I checked it multiple times)

void validateFields() {
    RegExp regExp = new RegExp(r'[!@#<>?"\s:_`~;[\]\\|=+)(*&^%-]|^$');
    if (regExp.hasMatch(nameController.text) || regExp.hasMatch(surnameController.text) || regExp.hasMatch(phoneController.text)){
      setState(() {
        isButtonDisabled = true;
      });
    }
    else {
      setState(() {
        isButtonDisabled = false;
      });
    }
  }

And Here is my submit button

onPressed: isButtonDisabled ? null : (){
 //upload the form
}

@AnirudhBagri I am calling it inside the build method before the return statement — ulmas, May 22 '20 at 12:49
I think isButtonDisabled = true; this should be in else block and vice versa — Jitesh Mohite, May 22 '20 at 12:50
Please check this https://stackoverflow.com/a/49354576/10150796 — Nikunj Kumbhani, May 22 '20 at 13:10

score 0 · Answer 1 · answered May 22 '20 at 12:53

setState method rebuilds the widget tree, so all your widgets will get refreshed.

One way is to consider checking for regex validation after the button is clicked. Simply show a snackbar warning if regex doesnt match or do the next action if it matches.

Second would be to change the state of button when some text is submitted in the text field. You can use TextController to change the state of the button whenever something is written.

score 0 · Accepted Answer · answered May 22 '20 at 13:38

I resolved the problem by adding the listener to the textController

nameController.addListener(() { 
     validateField(nameController.text);
    });

  void validateField(text) {
    RegExp regExp = new RegExp(r'[!@#<>?"\s:_`~;[\]\\|=+)(*&^%-]|^$');
   if (regExp.hasMatch(text)) {
       setState(() {
         isButtonDisabled = true;
       });
     } else {
       setState(() {
         isButtonDisabled = false;
       });
     }
  }
}

What is the correct way of disabling the button when it contains empty string or spaces

2 Answers2