How to force the user to enter an specific number in Flutter?-CodePudding

By using TextEditingController in Flutter, I'm trying to force the user to enter a number that starts with zero and then the number 4 or 8, then enter whatever he wants. Like this:

04****** or 08******

What should I do?

My code:


 TextFormField(
                       maxLength: 10,
                          controller: _inputdat,
                          inputFormatters: [ FilteringTextInputFormatter.digitsOnly,],
                          keyboardType: TextInputType.number),
               ElevatedButton(
                      ......
                        onPressed: () async {
                          if (_inputdat.text.length < 10
                             || !RegExp(r'^[0][8/4/2]{1}[0-9]{8}$').hasMatch(value))
                          {
                            ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
                                backgroundColor: Color(0xff446d74),
                                content: Text(
                                  "Error",
                                )));

What's wrong with my code? I got the error: Undefined name 'value'.

CodePudding user response：

Use this regex in the TextFormFiled validator r'^[0][4/8]{1}[0-9]{7}$'

If you want to specify a specific number in total you can specify it in this part [0-9]{7} instead of seven you can choose different number.

This regex has in total of 9 numbers:

start with Zero [0]

Second choose one 4 or 8 [4/8]{1}

Third choose any 7 number [0-9]{7}

The validator should look something like this:

  validator: (value) {
                      if (value!.isEmpty || !RegExp(r'^[0][9/7]{1}[0-9]{7}$').hasMatch(value)) {
                        return "error message";
                      } else {
                        return null;
                      }
                    },

initialize a form key like below:

  final formKey = GlobalKey<FormState>();

Full code:

Form(
      autovalidateMode: AutovalidateMode.onUserInteraction,
      key: formKey,
      child: Column(
        children: [
          TextFormField(
              validator: (value) {
                if (value!.isEmpty || !RegExp(r'^[0][9/7]{1}[0-9]{7}$').hasMatch(value)) {
                  return "error message";
                } else {
                  return null;
                }
              },
              decoration: const InputDecoration(
                errorMaxLines: 2, // specify how many error lines you want
                border: OutlineInputBorder(),
                labelText: 'number',
              ),
              maxLength: 10,
              controller: _inputdat,
              inputFormatters: [FilteringTextInputFormatter.digitsOnly],
              keyboardType: TextInputType.number),
          ElevatedButton(
            onPressed: () {
              if (formKey.currentState!.validate()) {
                // do something like a function or toast message etc...
              }
            },
            child: const Text('Confirm'),
          ),
        ],
      ),
    ),

CodePudding user response：

You can use https://pub.dev/packages/mask_text_input_formatter and do something like this:

var maskFormatter = new MaskTextInputFormatter(
  mask: '0*########', 
  filter: { "*": RegExp(r'[48]'), "#": RegExp(r'[0-9]') },
  type: MaskAutoCompletionType.lazy
);

and then pass maskFormatter to your text filed

TextField(inputFormatters: [maskFormatter])