Add a special character inside of textformfield input [Flutter]

Question

In a classic textformfield widget, I want to put the "/" character automatically after the fourth character when the user enters input. How can I do this?

Thanks for help!

Example input 2012/324234

                 OcasTextFormFieldContent(
                      maxLength: 12,
                      inputType: TextInputType.number,
                      validator: (String? fieldContent) {
                        if (fieldContent == "" || fieldContent == null) {
                          return 'not empty';
                        } else if (fieldContent.length < 12) {
                          return 'wrong type.';
                        } else {
                          return null;
                        }
                      },
                      controller: _dosyaNo,
                      name: "Doc No: ",
                      placeholder: "Please enter doc no"),

Solution 1

                OcasTextFormFieldContent(
                     onChanged: (value) {
                       if(value.length >= 4 && !value.contains("\\")) {
                       value = '$value\\';
                      _dosyaNo.value = TextEditingValue(text: 
                      value,selection: TextSelection.collapsed(offset: 
                      value.length),);
                       } 
                        },
                          maxLength: 12,
                          inputType: TextInputType.number,
                          validator: (String? fieldContent) {
                            if (fieldContent == "" || fieldContent == null) {
                              return 'not empty';
                            } else if (fieldContent.length < 12) {
                              return 'wrong type.';
                            } else {
                              return null;
                            }
                          },
                          controller: _dosyaNo,
                          name: "Doc No: ",
                          placeholder: "Please enter doc no"),

Solution 2

If you want to add / automatically, you can use onChange property of TextField.

You can add following code in onChange property

onChanged : (String value) {
  if(value.length >= 4 && !value.contains("\\")) {
    value = '$value\\';
    _dosyaNo.value = TextEditingValue(text: value,selection: TextSelection.collapsed(offset: value.length),);
  } 
}

Comments

[Sagar Acharya]

you can check this one stackoverflow.com/a/68203326/12000053

[keyur]

This is working, but when the user erases value. Value can't be erase so that why is not userfull

[Kutluhan Özbakan]

Thanks for help, it works! When i try the delete all the input, the '/' is not deleting. but it is ok with me.

[Anandh Krishnan]

if(value == "/"){ value = ''; }

[Anandh Krishnan]

add the condition on your onchanged