How can I change a jQuery UI widget's options after it has been created?

davidscolgan picture davidscolgan · Nov 3, 2011 · Viewed 8.1k times · Source

It seems that the usual method of making jQuery widgets is to call a function on an element, passing the options as a parameter, and then not touching the widget directly again. Is there a way to change a widget's options after it has been created?

I want to create a draggable box that is aligned to a grid, but if the user resizes the page, I want to scale the grid. In the window resize event, how can I access the grid property of the draggable element?

$('.box').draggable({grid: [40,40]});
...
$(window).resize(function(){ ??? });

Answer

Keith.Abramo picture Keith.Abramo · Nov 8, 2011

From the Jquery ui documentation:

$( ".selector" ).draggable( "option", "grid", [50, 20] );

So you can do

$( ".box" ).draggable( "option", "grid", [width, height] );