Home > Software design >  email validation flutter before running API
email validation flutter before running API

Time:03-09

I'm making forget password screen for my app and API has integrated in my code. when I click "reset password" button by submitting empty field it running my API code. but I want to run email validation when I submit empty field and click "reset button". how can I do that part in my code. appreciate your help on this.

enter image description here

import 'package:dio/dio.dart';
import 'package:doctor_app/constants/Button.dart';
import 'package:doctor_app/constants/base_api.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:get/get_core/src/get_main.dart';

import '../constants/colors.dart';

class ForgetPassword extends StatelessWidget {
  const ForgetPassword({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    SystemChrome.setEnabledSystemUIMode(SystemUiMode.leanBack);
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Padding(
        padding: const EdgeInsets.all(20.0),
        child: Column(
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                SizedBox(
                  height: 20,
                ),
                Text('DOCTOR',
                    style: TextStyle(
                      fontFamily: 'Dubai',
                      fontSize: 30,
                      color: Color(0xff05ABA3),
                      fontWeight: FontWeight.w500,
                    )),
              ],
            ),
            SizedBox(
              height: 90,
            ),
            Row(mainAxisAlignment: MainAxisAlignment.start, children: [
              Text('Forgot your password?',
                  style: TextStyle(
                    height: 1.2,
                    fontFamily: 'Dubai',
                    fontSize: 25,
                    color: Color(0xff040000),
                    fontWeight: FontWeight.w500,
                  )),
            ]),
            // Spacer(
            //   flex: 1,
            // ),
            SizedBox(
              height: 20,
            ),
            Column(
              //mainAxisAlignment: MainAxisAlignment.center,
              //crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Text('Confirm your email and we will send the Instructions ',
                    style: TextStyle(
                      height: 1.2,
                      fontFamily: 'Dubai',
                      fontSize: 18,
                      color: Color(0xff707070),
                      fontWeight: FontWeight.w100,
                    )),
              ],
            ),
            SizedBox(
              height: 20,
            ),

            ForgetPasswordForm(), //email
            SizedBox(
              height: 5,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(
                  'didnt receive an email?',
                  style: TextStyle(
                    height: 1.2,
                    fontFamily: 'Dubai',
                    fontSize: 13,
                    color: Colors.grey,
                    fontWeight: FontWeight.w500,
                  ),
                ),
                SizedBox(
                  width: 5,
                ),
                Align(
                    alignment: Alignment.bottomLeft,
                    child: InkWell(
                        onTap: () {
                          // add action here whatever you want.
                        },
                        child: Text('send again  ',
                            style: TextStyle(
                              height: 1.2,
                              fontFamily: 'Dubai',
                              fontSize: 13,
                              color: Colors.blue,
                              fontWeight: FontWeight.w500,
                            ))))
              ],
            ),
            Spacer(
              flex: 1,
            ),

            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(5.0),
                    color: Color(0xff05ABA3),
                  ),
                  height: 5,
                  width: 120,
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}

class ForgetPasswordForm extends StatefulWidget {
  const ForgetPasswordForm({Key? key}) : super(key: key);

  @override
  _ForgetPasswordFormState createState() => _ForgetPasswordFormState();
}

class _ForgetPasswordFormState extends State<ForgetPasswordForm> {
  final _formKey = GlobalKey<FormState>();

  //String _userName = "";

  String email = "";

  Future Resetpassword() async {
    try {
      var response = await Dio().post(BASE_API 'user/forgotpassword', data: {
        "email": email,
      });

      if (response.data["data"] ==
          "Please check your email to reset password.") {
        Get.snackbar("success", "Email Sent Successfully!");
        //Get.to(VideoScreen());

      } else {
        Get.snackbar("Error", "No Server Found",
            backgroundColor: textWhite.withOpacity(0.5),
            borderWidth: 1,
            borderColor: textGrey,
            colorText: textGrey,
            icon: Icon(
              Icons.error_outline_outlined,
              color: heartRed,
              size: 30,
            ));
      }
      print("res: $response");
    } catch (e) {
      Get.snackbar("Error", "Something went wrong.Please contact admin",
          backgroundColor: textWhite.withOpacity(0.5),
          borderWidth: 1,
          borderColor: textGrey,
          colorText: textGrey,
          icon: Icon(
            Icons.error_outline_outlined,
            color: heartRed,
            size: 30,
          ));
      print(e);
    }
  }

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
        child: Form(
            child: Container(
                key: _formKey,
                child: Container(
                    child: Padding(
                  padding: const EdgeInsets.all(30.0),
                  child: Column(children: [
                    TextFormField(
                      keyboardType: TextInputType.emailAddress,
                      decoration: const InputDecoration(
                          hintText: "Email",
                          hintStyle: TextStyle(
                              color: textGrey,
                              fontFamily: "Dubai",
                              fontSize: 14)),
                      validator: (String? Email) {
                        if (Email != null && Email.isEmpty) {
                          return "Email can't be empty";
                        }
                        return null;
                      },
                      onChanged: (String? text) {
                        email = text!;
                        print(email);
                      },
                    ),
                    SizedBox(
                      height: 50,
                    ),
                    Container(
                      child: GestureDetector(
                        child: ButtonM("Reset Password"),
                        onTap: () async {
                          Resetpassword();
                        },
                      ),
                    )
                  ]),
                )))));
  }
}

CodePudding user response:

Just wrap your ResetPassword() method like below:

 if (_formKey.currentState!.validate()) {
   Resetpassword();
 }

This will check the validation.

Make sure key in attached to Form widget not Container

class ForgetPasswordForm extends StatefulWidget {
  const ForgetPasswordForm({Key? key}) : super(key: key);

  @override
  _ForgetPasswordFormState createState() => _ForgetPasswordFormState();
}

class _ForgetPasswordFormState extends State<ForgetPasswordForm> {
  final _formKey = GlobalKey<FormState>();

  String email = "";

  Future Resetpassword() async {
    print("123");
  }

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
        child: Form(
           key: _formKey,
          autovalidateMode: AutovalidateMode.disabled,
            child: Container(
                child: Container(
                    child: Padding(
                  padding: const EdgeInsets.all(30.0),
                  child: Column(children: [
                    TextFormField(
                      keyboardType: TextInputType.emailAddress,
                      decoration: const InputDecoration(
                          hintText: "Email",
                          hintStyle: TextStyle(
                              color: Colors.grey,
                              fontFamily: "Dubai",
                              fontSize: 14)),
                      validator: (String? Email) {
                        if (Email != null && Email.isEmpty) {
                          return "Email can't be empty";
                        }
                        return null;
                      },
                      onChanged: (String? text) {
                        email = text!;
                        print(email);
                      },
                    ),
                    SizedBox(
                      height: 50,
                    ),
                    Container(
                      child: TextButton(
                        child: Text("Reset Password"),
                        onPressed: () async {
                          if (_formKey.currentState!.validate()) {
                            Resetpassword();
                          }
                        },
                      ),
                    )
                  ]),
                )))));
  }
}

CodePudding user response:

Can I have a screenshot of your login screen and the forgotten password screen? I don't quite understand your question.

  • Related