I'm new to flutter and I'm trying to make a button disabled as long as some text fields are empty, so i made 3 textcontrollers to act as a controller for the 3 text fields and i made a function to check the function is:
bool isEmpty(){
setState(() {
if(textEditingController.text!=" "&&textEditingController2.text!=" "&& textEditingController3.text!=" "){
isButtonEnabled=true;
}
});
return isButtonEnabled;
}
And the code for the text field is:
TextField(
onSubmitted:null,
controller: textEditingController3,
)
Then i write the code for the button as follows: Center(
child: RaisedButton(
child: Text("Button 1",style: TextStyle(color:Colors.white),),
onPressed:isButtonEnabled?(){ print("enabled");}:null,
color: Colors.red,
),
The problem is the button remains disabled even after i write in the text fields. Any idea? Thanks in advance. EDIT: thanks to @diegoveloper answer this worked, but what if i wanted to put intital value and i want the button to be enabled only if the text fields have values for the text fields as following :
@override
void initState() {
super.initState();
textEditingController = new TextEditingController(text: name);
textEditingController2 = new TextEditingController(text: email);
textEditingController3 = new TextEditingController(text: " place");
}
Then i updated the isEmpty method to be:
bool isEmpty(){
setState(() {
if((textEditingController.text!=" ")&&(textEditingController2.text!=" ")&& (textEditingController3.text!=" ")&&(textEditingController!=null)&&(textEditingController2!=null)&&(textEditingController3!=null)){
isButtonEnabled=true;
}
else{
isButtonEnabled=false;
}
});
return isButtonEnabled;
}
The problem is despite of the intials values i gave to text fields the button is still disabled, also when i edit the 3 values of textfields the button is enabled, but if i deleted the text (in which i think it's meant by null) the button is still disabled.
You don't need any additional libraries to do that. Flutter has it out-of-the-box and you can make sure you're not going to rebuild the whole tree on each keystroke.
TextEditingController
extends ValueNotifier<TextEditingValue>
which means you can utilize ValueListenableBuilder
from material
package to listen to text changes.
class MyWidget extends StatelessWidget {
final TextEditingController _inputController = TextEditingController();
@override
void dispose() {
_inputController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Column(children: [
TextField(controller: _inputController),
ValueListenableBuilder<TextEditingValue>(
valueListenable: _inputController,
builder: (context, value, child) {
return ElevatedButton(
onPressed: value.text.isNotEmpty ? () {} : null,
child: Text('I am disabled when text is empty'),
);
},
),
]);
}
}