jQuery UI Draggable：Stack on Click

Question

Is there any way to kick off a draggable 's stack procedure when it is clicked, not just dragged?

I found this solution, which basically tries to just copy the library code. (It is also missing an important piece which I inserted below). Is there not a more elegant solution?

Modifying the author's code, the following solution works:

function bringFront(elem, stack){
    // Brings a file to the stack front
    var min, group = $.makeArray($(stack)).sort(function(a, b) {
        return (parseInt($(a).css("zIndex"), 10) || 0) - (parseInt($(b).css("zIndex"), 10) || 0);
    });

    if(group.length < 1) return;
    min = parseInt(group[0].style.zIndex, 10) || 0;
    $(group).each(function(i) {
        this.style.zIndex = min+i;
    });

    if(elem == undefined) return;
    $(elem).css({'zIndex' : min+group.length});
}

But it would obviously be better to call the library method somehow.

Answer 1

Found a solution by hacking the jquery draggable widget:

$('#myDraggable').click(function(event){
    var widget = $('#myDraggable').data('ui-draggable');
    widget._mouseStart(event);
    widget._mouseDrag(event);
    widget._mouseStop(event);   
}); 

Answer 2

Have you simply tried triggering the draggable stack off a click?

 $('#target').on("click", function() {
       $( this ).draggable({ stack: "#products" });
 });