Tengo pocos componentes en mi página que se puedan arrastrar. Tienen la clase arrastrable. Cuando esto se arrastra y se detiene, necesito obtener las posiciones izquierda y superior

 function init() { var p = $('#groups-parent'); $('.draggable').draggable({ obstacle: ".obstacle", preventCollision: true, containment: [ p.offset().left, p.offset().top, p.offset().left + p.width() - 225, p.offset().top + p.height() - 50 ], start: function(event, ui) { $(this).removeClass('obstacle'); }, stop: function (event, ui) { console.log(ui); $('#groups-parent').css({ 'min-height': Math.max(500, ui.position.top + 50) }); $(this).addClass('obstacle'); getTopLeftPosition(); } }); }

Aquí está mi función que debería obtener las posiciones izquierda y superior.

 function getTopLeftPosition(e) { var coordX = e.pageX - $(this).offset().left, coordY = e.pageY - $(this).offset().top; alert(coordX + ' , ' + coordY); }

Esto no funciona. Todo lo que obtengo en mi navegador es este mensaje de error

No se pueden leer las propiedades de undefined (leyendo 'izquierda')

¿Cómo puedo obtener esta posición izquierda y superior? La alerta debe indicarlo.