Gridstack.js: custom drag handle

[KrishnaPG]

Is there any example for custom drag handle usage?
I am trying to make items draggable only by using a panel header (and not the whole body) - tried below code with many possible combinations, but couldn't get success

    <div class="grid-stack">
        <div class="grid-stack-item"
                 data-gs-x="0" data-gs-y="0"
                 data-gs-width="4" data-gs-height="2">
            <div class="grid-stack-item-content panel panel-default">
                <div class="panel-heading clearfix">
                    <span class="panel-title pull-left"><span class="glyphicon glyphicon-asterisk"></span> <span class="panel-title-text">Featuring</span></span>
                </div>
                <div class="panel-body ">
                    <ul class="list-group">
                        <li class="list-group-item">a</li>
                        <li class="list-group-item">v</li>
                    </ul>
                </div>
            </div>
        </div>
    </div

the js code:

    var options = {
        cell_height: 80,
        vertical_margin: 10,
        animate: true,
        handle:  ??? 
    };
    this.$('.grid-stack').gridstack(options);

tried handle:'.panel', handle:'panel-heading' and even without handle. And tried removing the grid-stack-item-content class also - but in all cases the result was either the whole thing moves or nothing moves at all.

How to make the item movable only by its header?

[indriemarius]

Hey Krishna,

The issue seems to be in your options var.

If you take a look in the library code you can see, starting with line 379, the default options and the way the are organized.

The handle for a custom draggable container needs to be a sub property of the draggable property; your js code needs to look something like this:

var options = {
    cell_height: 80,
    vertical_margin: 10,
    animate: true,
    draggable: {
        handle: '.panel-heading',
    }
};
this.$('.grid-stack').gridstack(options);

[KrishnaPG]

Cool - that's working like a charm - you are great. Been kicking over it for the whole day, and here is your answer, and its just working :) Amazing.

[buffalonan]

It really helped guys, thanks.