vanshg395/intl_phone_field

validation is not working properly

Anandh2708 opened this issue · 4 comments

Anandh2708 commented

validation not working properly. when i try to call validate funtion without enter any input it doen't call the validator method.

naumanahmed19 commented

facing same issue

vishalvishvakarma1111 commented

facing same issue with this code
version
intl_phone_field: ^3.2.0
----- view ------

IntlPhoneField(

             controller: provider.phoneController,
            showCountryFlag: false,
            showDropdownIcon: true,
            pickerDialogStyle: PickerDialogStyle(
              countryNameStyle: AppTheme.instance.textFieldStyle.copyWith(color: Colors.black),
              countryCodeStyle: AppTheme.instance.textFieldStyle.copyWith(color: Colors.black),
            ),
            onCountryChanged: (country) => provider.setCountry(country),
            style: AppTheme.instance.textFieldStyle.copyWith(color: Colors.black),
            textInputAction: TextInputAction.next,
            dropdownTextStyle: AppTheme.instance.textFieldStyle.copyWith(color: Colors.black),
            keyboardType: TextInputType.number,
            decoration: _decoration,
            initialCountryCode: controller.initialCountryCode,
            onChanged: (phone) {
              // provider.setCountry(phone);
              debugPrint(phone.completeNumber);
            },
          )
          --------
          on button click
          
          
  if (phoneController.text.isNotEmpty && !(formKey.currentState?.validate() ?? false)) {
    AppUtils.showErrorSnackBar(phoneValidation);
    return;
  }
  
  selected country AF
  +93  9685111112
  
  10 /9 
  sometime validate sometime not
mrunal-atreya commented

@Anandh2708 @naumanahmed19 I am also facing same issue. i manage to display error message somehow but i am not able to change border to red
Row(
children: [
Expanded(
child: Column(
crossAxisAlignment:CrossAxisAlignment.start,
children: [
IntlPhoneField(
controller: _mobileNumberController,
decoration: InputDecoration(
alignLabelWithHint: true,
contentPadding: EdgeInsets.symmetric( vertical: 2.h, horizontal: 2.w),
suffixIcon: displayMobileNumberNotRegisteredLogo != null && displayMobileNumberNotRegisteredLogo != false
? const Icon(Icons.verified, color: Colors.green)
: displayMobileNumberRegisteredLogo == true
? const Icon(Icons.close_rounded,color: Colors.red)
: const Icon(Icons.verified, color: Colors.transparent),
labelText: "Mobile number*",
filled: true,
fillColor: ColorConstants.white,
border: OutlineInputBorder(
borderSide: const BorderSide(color: ColorConstants.textFormBorder),
borderRadius: BorderRadius.circular(1.w),
),
errorBorder: OutlineInputBorder(
borderSide: const BorderSide(color: ColorConstants.errorInputBorderColor),
borderRadius: BorderRadius.circular(1.w),
),
focusedErrorBorder: OutlineInputBorder(
borderSide: const BorderSide( color: ColorConstants.errorInputBorderColor),
borderRadius:BorderRadius.circular(1.w),
),
errorStyle: (screenWidth > 600)? TabErrorInputTextStyleforLogin() : ErrorInputTextStyleforLogin(),
counter: const Offstage(),
labelStyle: (screenWidth > 600) ? TabSignUpLabelStyle() : SignUpLabelStyle(),
),
validator: (value) {
if (_mobileNumberController.text.isEmpty) {
_scrollToError();
return "Enter mobile number";
}
return null;
},
inputFormatters: [ FilteringTextInputFormatter.digitsOnly],
autovalidateMode: _mobileNumberController.text != "" ? AutovalidateMode.always: AutovalidateMode.disabled,
onChanged: (phone) {
if (phone.number != '') {
validationMessage = "";
setState(() {});
return;
}
},
dropdownIconPosition: IconPosition.trailing,
keyboardType: TextInputType.number,
flagsButtonPadding: EdgeInsets.symmetric(vertical: 0.8.h),
flagsButtonMargin: EdgeInsets.symmetric(horizontal: 5.w),
initialCountryCode: "IN",
onCountryChanged: (phone) {
selectedCountryCode = "+${phone.dialCode}";
setState(() {});
},
style: (screenWidth > 600) ? TabSignUpTextFieldStyle() : SignUpTextFieldStyle(),
),
if (validationMessage != "")
Padding(
padding: EdgeInsets.only(top: 2.0, left: 15.0, bottom: 10.0),
child: Text(validationMessage, style: ErrorInputTextStyleforLogin()))
],
),
)
],
),
and my form submission button
onButtonPressed: () async {
enteredMobileNumber = "$selectedCountryCode ${_mobileNumberController.text.trim()}";
if (_mobileNumberController.text.isEmpty) {
setState(() {
validationMessage = "Enter mobile number";
});
} else {
validationMessage = "";
}
you resolve this issue ?

hani-hj1908619 commented

Was facing the same issue, I've posted a quick fix in #374

  • 👍1