I have 2 text fields that checks if empty On value change but the problem is if I press the submit function and the text fields are empty it does not show the error. How do I implement checking values on submit and show the error on text field?
UI
Widget buildColumn() => Form(
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: buildTitle(),
),
SizedBox(
height: 10,
),
Padding(
padding: const EdgeInsets.all(8.0),
child: buildDesription(),
),
buildSubmit()
],
));
Widget buildTitle() => StreamBuilder<String>(
stream: manager.title,
builder: (context, snapshot) {
debugPrint(snapshot.toString());
return TextField(
onChanged: manager.inTitle.add,
decoration: InputDecoration(
labelText: 'Title',
labelStyle: TextStyle(fontWeight: FontWeight.bold),
errorText:
snapshot.error == null ? null : snapshot.error.toString()),
);
});
Widget buildDesription() => StreamBuilder<String>(
stream: manager.description,
builder: (context, snapshot) {
return TextField(
onChanged: manager.inDescription.add,
decoration: InputDecoration(
labelText: 'Description',
labelStyle: TextStyle(fontWeight: FontWeight.bold),
errorText:
snapshot.error == null ? null : snapshot.error.toString()),
);
});
Widget buildSubmit() => StreamBuilder<Object>(
stream: manager.isFormValid,
builder: (context, snapshot) {
return ElevatedButton(
onPressed: () {
if (snapshot.hasData) {
manager.submit();
debugPrint("YEs");
}
},
child: Text("SEND"));
});
}
Manager On submit does not check if title and description is empty
class CreatePostManager with Validation {
final _repository = PostRepository();
final _postsFetcher = PublishSubject<Post>();
Stream<Post> get addPost => _postsFetcher.stream;
final _title = BehaviorSubject<String>();
Stream<String> get title => _title.stream.transform(validateTitle);
Sink<String> get inTitle => _title.sink;
final _description = BehaviorSubject<String>();
Stream<String> get description =>
_description.stream.transform(validateDescription);
Sink<String> get inDescription => _description.sink;
final _loading = BehaviorSubject<bool>();
Stream<bool> get loading => _loading.stream.transform(checkLoading);
Sink<bool> get inLoading => _loading.sink;
Stream<bool> get isFormValid =>
Rx.combineLatest2(title, description, (a, b) => true);
Future submit() async {
inLoading.add(true);
String title = _title.value;
String description = _description.value;
Post itemModel = await _repository.addPost(title, description);
_postsFetcher.sink.add(itemModel);
inLoading.add(false);
return itemModel;
}
dispose() {
_postsFetcher.close();
}
}
Validator
mixin Validation {
final validateTitle =
StreamTransformer<String, String>.fromHandlers(handleData: (value, sink) {
if (value.isEmpty) {
sink.addError("Title cannot be empty");
}else {
sink.add(value);
}
});
final validateDescription =
StreamTransformer<String, String>.fromHandlers(handleData: (value, sink) {
if (value.isEmpty) {
sink.addError("Description cannot be empty");
}else {
sink.add(value);
}
});
final checkLoading =
StreamTransformer<bool, bool>.fromHandlers(handleData: (value, sink) {
sink.add(value);
});
}
On submit I want to check if textfields are empty and show the Error message. Currently it only shows when user types.