{"id":36,"date":"2011-05-10T12:19:37","date_gmt":"2011-05-10T12:19:37","guid":{"rendered":"http:\/\/www.plumrocket.com\/blog\/?p=36"},"modified":"2021-07-02T14:13:19","modified_gmt":"2021-07-02T14:13:19","slug":"how-to-redraw-jquery-slider","status":"publish","type":"post","link":"https:\/\/plumrocket.com\/blog\/how-to-redraw-jquery-slider","title":{"rendered":"Coding solution: How to redraw JQuery Slider?"},"content":{"rendered":"<p>In this example, we are going to fine-tune the wonderful JQuery Slider Plugin written by Egor Khmelev.<\/p>\n<p>Everything is great about this Slider except that it doesn&#8217;t allow you to refresh its settings live without reloading the page. For example, it would be very useful to be able to change the slider scale, dimension\/currency and\/or other settings. And it is a must-have if you building Jquery Price Slider and need to change scale depending on user input. <!--more--><\/p>\n<p>Here is the solution from Plumrocket developers:<\/p>\n<pre><pre class=\"brush: php; title: ; notranslate\" title=\"\">\n\n$(&quot;#Slider1&quot;).slider(&quot;redraw&quot;, { from: 0, to: 1000, scale: [0, '|', 500, '|', '1000+']});\n\n<\/pre>\n<p>Add this javascript code in FILE <strong>\/javascripts\/jquery.slider.js <\/strong>LINE: 420<\/p>\n<pre><pre class=\"brush: php; title: ; notranslate\" title=\"\">\n case &quot;redraw&quot;:\n self.domNode.remove();\n\n if(isDefAndNotNull(args[1])){\n $.extend(true,self.settings,args[1]);\n\n self.settings.interval = self.settings.to - self.settings.from;\n self.settings.value = self.inputNode.attr(&quot;value&quot;);\n self.is = {\n init: false\n };\n self.o = {};\n }\n\n self.create();\n\n break;\n<\/pre>\n<div class=\"clearfix center-b\">\n<div class=\"ie7-all\"><a class=\"greenblog\" title=\"JQuery Slider Script Demonstration\" href=\"http:\/\/www.plumrocket.com\/blog\/demos\/JSlider\/index.html\" target=\"_blank\" rel=\"nofollow noopener\"><span class=\"slid\">\u00a0\u00a0LIVE DEMO\u00a0\u00a0<\/span><\/a><\/div>\n<\/div>\n<p>Hopefully, this little fix will make someone\u2019s day better.<br \/>\nEnjoy!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In this example, we are going to fine-tune the wonderful JQuery Slider Plugin written by Egor Khmelev. Everything is great about this Slider except that it doesn&#8217;t allow you to refresh its settings live without reloading the page. For example, it would be very useful to be able to change the slider scale, dimension\/currency and\/or&#133; <a class=\"read-more\" href=\"https:\/\/plumrocket.com\/blog\/how-to-redraw-jquery-slider\">Read More<\/a><\/p>\n","protected":false},"author":1,"featured_media":3027,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[12],"tags":[13,14],"table_tags":[],"_links":{"self":[{"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/posts\/36"}],"collection":[{"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/comments?post=36"}],"version-history":[{"count":42,"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/posts\/36\/revisions"}],"predecessor-version":[{"id":7264,"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/posts\/36\/revisions\/7264"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/media\/3027"}],"wp:attachment":[{"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/media?parent=36"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/categories?post=36"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/tags?post=36"},{"taxonomy":"table_tags","embeddable":true,"href":"https:\/\/plumrocket.com\/blog\/wp-json\/wp\/v2\/table_tags?post=36"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}