custum edit in phone field

Hi @abdallahgh

I hope you are doing good today.

We do not have such a feature in the PRO version. Only difference between Free and PRO is an e-signature field.

Providing such an option could be out of scope, but I pinged our SLS Team to see how complex this will be and can we do something in this matter. Thank you for your patience while we look into this further.

Kind Regards,
Kris

hi @wpmudevsupport13
I appreciate your swift reply
have a nice day

Hi @abdallahgh,

Our SLS team has provided the following code that you can use as a mu-plugin.

You can find more information below on how to use mu-plugins.
https://wpmudev.com/docs/using-wordpress/installing-wordpress-plugins/#installing-mu-plugins

<?php
add_action( 'wp_footer', 'wpmudev_fix_intelinput_country', 9999 );
function wpmudev_fix_intelinput_country() {
	global $post;
    if ( is_a( $post, 'WP_Post' ) && !has_shortcode($post->post_content, 'forminator_form') ) {
        return;
    }
	?>
	<script type="text/javascript">
	jQuery( document ).ready( function($) {
		setTimeout(function() {
			$('.forminator-custom-form').trigger('after.load.forminator');
		},100);

		$(document).on('after.load.forminator', function(e, form_id) {
			var form        = $( '#forminator-module-2910' ),
				is_material = form.is('.forminator-design--material'),
				fields      = form.find('.forminator-field--phone');
			fields.each(function () {
				$(this).intlTelInput('destroy');
				var is_national_phone = $(this).data('national_mode'),
					country           = $(this).data('country'),
					validation        = $(this).data('validation');

				if ('undefined' !== typeof (is_national_phone)) {

					if (is_material) {
						//$(this).unwrap('.forminator-input--wrap');
					}

					var args = {
						nationalMode: ('enabled' === is_national_phone) ? true : false,
						initialCountry: 'undefined' !== typeof ( country ) ? country : 'us',
						utilsScript: window.ForminatorFront.cform.intlTelInput_utils_script,
					};

					if ( 'undefined' !== typeof ( validation ) && 'standard' === validation ) {
						args.allowDropdown  = false;
					}
					// stop from removing country code.
					if ( 'undefined' !== typeof ( validation ) && 'international' === validation ) {
						args.autoHideDialCode = false;
					}

					args.preferredCountries = ["al", "us", "gb"]; //These countries will appear at the top

					$(this).intlTelInput(args);

					if ( 'undefined' !== typeof ( validation )
						&& 'international' === validation ) {
						var dial_code = $(this).intlTelInput( 'getSelectedCountryData' ).dialCode,
							country_code = '+' + dial_code;
						if ( country_code !== $(this).val() ) {
							var phone_value = $(this).val().trim().replace( dial_code, '' );
								$(this).val( country_code + phone_value );
						}
					}

					if ( ! is_material ) {
						$(this).closest( '.forminator-field' ).find( 'div.iti' ).addClass( 'forminator-phone' );
					} else {
						$(this).closest( '.forminator-field' ).find( 'div.iti' ).addClass( 'forminator-input-with-phone' );

						if ( $(this).closest( '.forminator-field' ).find( 'div.iti' ).hasClass( 'iti--allow-dropdown' ) ) {
							$(this).closest( '.forminator-field' ).find( '.forminator-label' ).addClass( 'iti--allow-dropdown' );
						}
					}

					// intlTelInput plugin adds a markup that's not compatible with 'material' theme when 'allowDropdown' is true (default).
					// If we're going to allow users to disable the dropdown, this should be adjusted accordingly.
					if (is_material) {
						//$(this).closest('.intl-tel-input.allow-dropdown').addClass('forminator-phone-intl').removeClass('intl-tel-input');
						//$(this).wrap('<div class="forminator-input--wrap"></div>');
					}
				}
			});
		});
	});
	</script>
	<?php
}

You will need to change the form ID from 2910 to your form’s ID in this line
var form = $( '#forminator-module-2910' )

args.preferredCountries = ["al", "us", "gb"]; – In this line our SLS team have added a few example countries that will appear at the top. So, you can sort the countries this way and add more countries name in this array to make them appear at top.

This solution can also be found on https://gist.github.com/wpmudev-sls/92856992d220730aea7436e74e00762d

Kind regards,
Zafer

• This reply was modified 2 years, 5 months ago by Jair - WPMU DEV Support.

hi @wpmudevsupport15
I’ll do it
Thank you so much

hello .
I need some help edit and put the code that was attached to the plugin.

Hi again @abdallahgh,

Please provide us more details on the issue you need help with.

Kind regards,
Zafer

@wpmudevsupport15
I hired a developer and he asked me this question, but apparently he doesn’t know how to use mu-plugin, now I’ve deleted the phone field from the form temporarily, I may need it later, then I’ll look for another developer
Thank you so much

Hi @abdallahgh,

You are welcome.
Please let us know in case you need further help.

Kind regards,
Zafer