https://legacy.forums.gravityhelp.com/topic/calculation-not-working-with-jquery-ui-slider Gravity Support Forums Topic: Calculation not working with jQuery UI Slider en-US Sun, 19 Apr 2026 23:47:58 +0000 http://bbpress.org/?v=1.0.1 q https://legacy.forums.gravityhelp.com/search.php https://legacy.forums.gravityhelp.com/topic/calculation-not-working-with-jquery-ui-slider#post-234133 Thu, 02 May 2013 19:02:32 +0000 studio2 234133@https://legacy.forums.gravityhelp.com/ <p>I built a working slider. Add the class "slider" to your number field. Put the following code in document ready. This is sort of hacky and may have bugs in scenarios I wasn't trying to support, but it mostly works. </p> <pre><code>$(&quot;.slider .ginput_container :input&quot;).hide(); $(&quot;.slider .ginput_container .instruction&quot;).hide(); $(&quot;&lt;div class=&#39;slider-value&#39;&gt;&lt;/div&gt;&quot;).insertBefore(&quot;.slider .ginput_container :input&quot;); $(&quot;&lt;div class=&#39;slider-display&#39;&gt;&lt;/div&gt;&quot;).insertAfter(&quot;.slider .ginput_container :input&quot;); $(&quot;.slider-display&quot;).slider({ range: &quot;min&quot;, value: 1, min: 1, max: 1000, create: function( event, ui ) { var value = $(this).prev(&#39;:input&#39;).val(); $(this).siblings(&#39;.slider-value&#39;).html( value ); var min = parseInt($(this).next(&#39;.instruction&#39;).find(&#39;strong&#39;).eq(0).html()); var max = parseInt($(this).next(&#39;.instruction&#39;).find(&#39;strong&#39;).eq(1).html()); $(this).slider(&quot;option&quot;, &quot;min&quot;, min ); $(this).slider(&quot;option&quot;, &quot;max&quot;, max); $(this).slider(&quot;option&quot;, &quot;value&quot;, value); }, slide: function( event, ui ) { var value = $(this).slider( &quot;value&quot; ); $(this).prev(&#39;:input&#39;).val(value); $(this).prev(&#39;:input&#39;).trigger(&quot;change&quot;); $(this).siblings(&#39;.slider-value&#39;).html( value); } });</code></pre> <p>It grabs the supported range from the instruction field. It's definitely not ideal but I didn't see any other place where that info is available in the DOM. </p> https://legacy.forums.gravityhelp.com/topic/calculation-not-working-with-jquery-ui-slider#post-233890 Thu, 02 May 2013 14:32:01 +0000 eCurtis 233890@https://legacy.forums.gravityhelp.com/ <p>Hi Intervaro,</p> <p>I have been tasked with a similar project and I see you have a version working, perhaps not with number fields, on the bottom of your page. Any advice/instructions on how to get this working?</p> <p>Cheers. </p> https://legacy.forums.gravityhelp.com/topic/calculation-not-working-with-jquery-ui-slider#post-83526 Thu, 25 Oct 2012 00:40:04 +0000 Chris Hajer 83526@https://legacy.forums.gravityhelp.com/ <p>There are no sliders I've seen which work with Gravity Forms without some configuration. It looks like your implementation is close. Seems like the fields are just not getting updated at the right time to enable calculations. </p> https://legacy.forums.gravityhelp.com/topic/calculation-not-working-with-jquery-ui-slider#post-83398 Wed, 24 Oct 2012 16:30:08 +0000 intervaro 83398@https://legacy.forums.gravityhelp.com/ <p>Ok,</p> <p>Thanks for your reply. Do you support some other Javascript-number sliders? Would love to do this through Gravity Forms.</p> <p>Thank you! </p> https://legacy.forums.gravityhelp.com/topic/calculation-not-working-with-jquery-ui-slider#post-83236 Wed, 24 Oct 2012 08:49:33 +0000 Chris Hajer 83236@https://legacy.forums.gravityhelp.com/ <p>Integrating this jQuery slider is outside of the support we can provide for Gravity Forms. It looks like a really nice implementation and I hope you can make it work. </p> https://legacy.forums.gravityhelp.com/topic/calculation-not-working-with-jquery-ui-slider#post-81998 Thu, 18 Oct 2012 08:40:18 +0000 intervaro 81998@https://legacy.forums.gravityhelp.com/ <p>I'm trying to create a form where my customers can fill out information to see how much time they can save when using my services.</p> <p>So I'm using a Number Field with Calculation. And it works as expected when I'm typing the values in the other Number Fields or Checkbox Fields.</p> <p>But when I'm using the jQuery Slider to control the Number Values the Calculation is not triggered. It is triggered again when I'm filling out another field with my keyboard though.</p> <p>Can i do something i my js to trigger the Calculation?</p> <p>You can see the form here: <a href="http://mtaccounting.se/spara-tid/" rel="nofollow">http://mtaccounting.se/spara-tid/</a></p> <p>Thank You! </p>