Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • September 27, 2017 at 12:58 am #857213
    L

    I just noticed that the Enfold contact form is not fully “smartphone friendly” and doesn`t switch the devices keyboard to a number input when the phone field is active. How to change the phone entry field type so the browser knows it is a phone number which is being asked? I know we need to change the form type but where to locate the shortcode file?

    Regards

    September 27, 2017 at 6:24 am #857322
    John Torvik

    Hey L,

    To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

    Best regards,
    John Torvik

    September 28, 2017 at 1:45 am #857765
    L

    Hi,
    It is not on a specific website. You can assume that it is a basic Enfold theme without any customizations.

    I mean that you can set up a contact form on any of your Enfold environment with a text field. Set it as a valid phone number and see the issue on your smartphone device. Normally, it should switch the keyboard to a phone number entry.

    What I want to know is: How to change the phone text field type to a phone number, so the browser know it is a phone number which is asked to fill-in? Where is the HTML/PHP code of the contact form located? Which line of code sets the field type?

    Regards

    September 29, 2017 at 9:43 am #858366
    Ismael

    Hi,

    It doesn’t switch because the input type is set to “text” by default. Please add this code in the functions.php file.

    // custom script
function add_custom_script(){
?>
<script>
(function($){
	function e() {
		$('.is_phone').attr({
			'type' : 'number',
			'inputmode' : 'numeric',
			'pattern' : '[0-9]*'
		});	
	}
   	
   	e();
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'add_custom_script');

    Best regards,
    Ismael

    October 2, 2017 at 8:23 pm #859357
    L

    Hi Ismael,

    Thanks for the code, it changed the field type but there is another problem now. After applying the code the number is not sent through email at all. You can make sure by testing it yourself. I think it might somehow be related with the field validation.

    Regards

    October 3, 2017 at 10:26 am #859559
    Ismael

    Hi,

    Please edit the js > shortcodes.js file, look for this code around line 3309:

    formElements: form.find('textarea, select, input[type=text], input[type=checkbox], input[type=hidden]'),

    Insert the “number” type.

    formElements: form.find('textarea, select, input[type=text], input[type=number], input[type=checkbox], input[type=hidden]'),

    Best regards,
    Ismael

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.