jQuery: Remove Drag and Drop Action from Content Pane of Sortable Portlet Widgets CodeUnit 26 JAN 2011

jQueryUI’s awesome sortable functionality makes it a breeze to create sortable widget dashboards, allowing you to place little widget panes across a number of columns to your heart’s desire. However, the default is that the entire widget or portlet pane forms part of the sortable interface, making it quite a pain when you have something like a horizontal scrollbar on your widget!

Thankfully though, it turns out that it is quite simple to remove the default drag and drop events from certain sections of your widget by simply assigning their identifiers to the cancel option when declaring your sortable setup.

In code:

            cancel: ".widgetportlet-content"

The above basically excludes every element with the class widgetportlet-content from reacting to the drag and drop functionality of the sortable element, giving you more control over the content of your widgets without sacrificing the flexibility that the sortable plugin gives you!


Related Link: http://jqueryui.com/demos/sortable/#portlets

Related Posts:

About Craig Lotter

South African software architect and developer at Touchwork. Husband to a cupcake baker and father to two little girls. I don't have time for myself any more.

  • Rahul Nair

    very useful thank you.

    to add on to this
    remove the following line so you can select items in the content again: