Flutter how to check if textfield is not empty on submit using rxdart

Viewed 1353

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.

0 Answers
Related