TutorialSlider Gravity Forms

Do you want to show a slider in your Gravity Form? This is the way to do it. Simply add a slider and decide how to show it: what is the maximum (in currency, or number) and minimum and which steps can they make.

Coming soon

We are currently busy with getting the Advanced Number Field Add-on for Gravity Forms ready to release. If you want to get updated when we release the plugin, subscribe to our Updates at the bottom of this page.

Enabling Slider

Screenshot of a number field with Show as Slider enabled.
Screenshot of a number field with Show as Slider enabled.

The Advanced Number Field add-on allows you to show a Gravity Forms Number Field as slider.

  • You can define a Minimum and Maximum Range for the Slider
  • You can define the Range Step (the intervals).
Screenshot of Advanced Range Settings with Show as Slider enabled.
Screenshot of Advanced Range Settings with Show as Slider enabled.

Showing slider value real-time

You can use this little snippet to show a real-time number while scrolling through the range slider.

<span id="slidernumber"></span>
jQuery(document).ready(function($) {
	$(document).on('input', '#input_15_1', function() {
		$('#slidernumber').html( $(this).val() );
	});
});

Advanced Number Field

For this functionality, you need the Advanced Number Field plugin from GravityWP.

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close