X / Y Coordinates not displaying right on drag using jquery ui draggable

X / Y Coordinates not displaying right on drag using jquery ui draggable

I'm attempting to get it so it displays the x/y coordinates as an object is dragged accross the screen.  For some reason, it seems the coordinates are always 1 step off as I drag it.  The following is the the function I am using to initialize the draggable:
 
 newTextboxParent.draggable
 (
  {
   containment: 'parent',
   addClasses: false,
   
   drag: function()
   {
    $(this).draggable('option', 'grid', ($('#snapGrid').attr('checked') ? [ parseInt($('#grid_x').val()), parseInt($('#grid_y').val()) ] : false));
    
    var position = $(this).position();









    $('#location_x').val(position.left);
    $('#location_y').val(position.top);
    setHorizontalGuide();
    setVerticalGuide();
   }
  }
 );



 
When it drag it, say 1 pixel to the right, the "location_x" still shows it is "0", when I drag it 1 more to the right, it says "1".  If I at that point reverse it, and move it 1 pixel to the left, it says "2", one more to the left, it says "1", even though it is actually at the "0" position.  I have it set to be contained within its parent, so it can't move to the left any more.  However, if I continue the mouse movement to the left, it does eventually set the "location_x" to "0", but the object doesn't move any further.  This behavior applies to the "y" coordinates, as well, and happens in all browsers.  I don't know if it is something I'm doing wrong, or if this is just the way jquery ui behaves?  Any thoughts?