Need to get location of draggable div
<p>I have a draggable div and what I want to do is be able to capture the location of the div on the page after its been dragged and the from has been submitted.  </p>

<p>i plan to have that div render in the last location it was at when the page reloads.</p>

<p>My question for now is how can I capture I assume the coordinates or loacation of where the div is at after I have dragged it around the page?</p>

<p>here is my code:</p>

<pre><code>&lt;script type="text/javascript"&gt;

$(document).ready(function()
{
    $("#filterItem").click(function() {
        $("#filterPanel").fadeToggle("slow", function() {
            toggleImg( 'filter' );
        });
        $(this).toggleClass("active");
        toggleImg( "filter" );
        return false;
    });
    $("#filterPanel").draggable({ snap: "#filterItem" });

    $("#mgmtViewHeaders [title]").tooltip();
});

function closeDraggablePanel( panelName, topPos)
{
    $("#"+panelName+"Panel").toggle("slow", function() {
        toggleImg( 'filter' );
        // Reposition to default
        $("#"+panelName+"Panel").css( "top", topPos);
        $("#"+panelName+"Panel").css( "left", "25");
    });

}
</code></pre>

<p></p>

<p>HTML:</p>

<pre><code>&lt;c:set var="filterTop" value="150" scope="page"/&gt;

&lt;div id="filterDiv"&gt;
&lt;ul class="sideMenu" style="top: ${filterTop}px;"&gt;
&lt;li style="border-bottom: none;"&gt;
    &lt;div id="filterItem" class="sideMenuDiv"&gt;&lt;span&gt;&lt;img src="../images/plus.gif" /&gt;&amp;nbsp;Filters&lt;/span&gt;
    &lt;/div&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;

&lt;%-- Y coordinate of the top edge of the filter panel. --%&gt;
&lt;c:set var="panelTop" value="${filterTop}" scope="page"/&gt;

&lt;div class="sideMenuPanel" style="display: none; width: 290px; top: ${panelTop}px;" id="filterPanel"&gt;
&lt;/div&gt;
</code></pre>
