Search code examples
wordpressslidergravity

WP Gravity Form - add a range slider

I would like to enter a range slider instead a nummeric input field inside my Gravity Form. The support from GF told me, that such an input type is not available right now but I can easily integrate the jQuery slider for example. Look here: http://jqueryui.com/slider/#rangemin

So here is what I did. I entered the followin code into my header.php:

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<script>
jQuery(function() {
jQuery( "#slider-range-min" ).slider({
range: "min",
value: 5,
min: 0,
max: 100,
slide: function( event, ui ) {
jQuery( "#amount" ).val( "$" + ui.value );
}
});
jQuery( "#amount" ).val( "$" + jQuery( "#slider-range-min" ).slider( "value" ) );
});
</script>

After that I used the class "slider-range-min" ass a class at one of my input text fields. Problem is: The slider does not appear. I do not receive an error message or something similar. It is just the slider that does not appear.

Can someone help me and tell me what I am doing wrong?

Kind Regards, Chris

Solution

  • Actually with the update to Gravity Form 1.9 a plugin appeared on wordpress.org which is exactly what I need.

    If anyone else is looking for a gravity view slider get a look at this plugin: https://wordpress.org/plugins/gravity-slider-fields/

    It is running stable on my site.

    Regards, Chris