Set custom inputmode for Fluent Form number field

When using the Fluent Form number field on iOS, it shows the numeric keypad, however if you have decimals enabled as an option, then there’s no way to use the decimal point on iOS. This is where the inputmode property comes in. If we change the inputmode to decimal then the keypad on iOS will render with a decimal point.

We can change the inputmode easily with a little PHP snippet.

The snippet

Add the code below to functions.php or code snippet plugin.

You can set the specific forms and fields you want to target with the variables target_form and target_field.

        function tct_number_inputmode($inputMode, $data, $form){
	$target_forms = array(1, 5);
	$target_fields = array('numeric_field', 'another_field');
	
	$is_forms = in_array($form->id, $target_forms);
	$is_fields = in_array($data['attributes']['name'], $target_fields);
	
	if( !$is_forms || !$is_fields ){
		return $inputMode;
	}
	
	return 'decimal';
}
add_filter('fluentform/number_input_mode', 'tct_number_inputmode', 10, 3);
      
Copy