我想验证 flutter 中的用户输入

Question

I'm trying to validate different user inputs, and i want to inform them which input is null i tried to show an alert dialog whenever the user hit the submit button while an input is null, but then i got an error and it didn't open the page saying i have to fill the information before i even open the page. However i tried a something else but unfortunately it didn't work ether this is what i did.

 TextFormField(
                    key: _formKey,
                    validator: (value) {
                      if (value == null) {
                        return 'please write a review';
                      } else if (DATA == null) {
                        return 'please select a category';
                      } else if (image == null) {
                        return 'please add an image';
                      } else if (tag == null) {
                        return 'please select sub category';
                      } else if (_descriptionController.text == null) {
                        return 'please select a location';
                      } else
                        return null;
                    },
                    maxLines: 20,
                    maxLength: 200,
                    controller: _descriptionController2,
                    decoration: InputDecoration(
                      contentPadding:
                          EdgeInsets.only(left: 10.0, top: 16.0),
                      hintText: "What do you think about the place?",
                      border: OutlineInputBorder(
                          borderRadius: BorderRadius.circular(16.0)),
                    ),
                  ),

That's what i added to the button when it's pressed

onPressed: () {
          bool valid = validation();
          if (valid)
            addData(image!, DATA!, lat, lng, _descriptionController2.text,
                tag!, loggedInUser2!);
          Navigator.pop(context);
        },

lastly this is the validation method

bool validation() {
final form = _formKey.currentState;
if (form!.validate()) {
  return true;
}
return false;

}

can any one help?

Answer 1

i think is unnecessary for doing validation of DATA,image, etc for description field. TextFormField will return String, it will always false when you do validation for DATA, image, etc.

just do like this:

Form(
  key:_formKey,
  child: Column(
    children:[
       TextFormField(
          validator: (String? value) {
            //  runType value is String? 
            //  which is it always false when you compare to image, or Data.
            if (value == null) {
              return 'please write a description';
            else
              return null;
            },
          controller: _descriptionController2,
        ),

then if you want to do validation for other data, i think you can make it manually.

if (DATA== null) {
  //do something 
}
...etc

Answer 2

The validator(String? value) in widget TextFormField should validate ONLY for its text value. Other fields like Data , image ... should be handled in another place.

I'm also working on validator for TextFormField and I realize that we shouldn't check null. Because when you first time navigate to this screen, the TextFormField will immediately show red error message below and it could make user uncomfortable. You should check null only when user press "Save/Comment" button and show popup/snack bar if the text is null/empty.

Also I got some tricks that you may interest:

• Use extension (extension for String? ) if you has some special cases can be used in future, like: valid email, valid password (8 character, special symbols)...

• Don't forget to use function .trim() to remove white space on textEditingController.