使用PHP获取表的坐标并存储在数据库中

Question

I have created a page and it has some tables. I have made these tables draggable and now I need to store the coordinates of the table as it moved over the provided area using PHP. please help me out in doing this, I couldn't figure it out. The code of the html page is:

<table class="smsSecond"><!--bgcolor="#4ab54d"><class="smsSecond"--     this is td bgcolor: bgcolor="#4ab54d"-->
        <tr style="background-color: #3C3C3C;" >
             <td colspan="2" width="auto" align="center">Ticket Info<img id="delete" src="icons/delete.png" height="10" width="10" style="float: right;"/></td>
        </tr>

        <!--odd row-->
        <tr class="oddrow" align="center"><!-- style="color: #000000; font-size: 12px;"-->
            <td>
                Ticket number
            </td>
            <td>
                HFK-864-69976
            </td>
        </tr>


        <!--even row-->
        <tr class="evenrow" align="center"><!--style="color: #000000; font-size: 15px; background-color: #FFFFFF" --><!--background-color: #A4EAF6-->
            <td>
                Department
            </td>
            <td>
                Support
            </td>
        </tr>

        <!--odd row-->
        <tr class="oddrow" align="center">
            <td>
                Priority
            </td>
            <td>
                P3-Normal
            </td>
        </tr>

        <!--even row-->
        <tr class="evenrow" align="center">
            <td>
                Open Date and Time
            </td>
            <td>
                2011-02-28 21:24:01          
            </td>
        </tr>

        <!--odd row-->
        <tr class="oddrow" align="center">
            <td>
                Close Date and Time
            </td>
            <td>
                2011-02-28 21:24:01
            </td>
        </tr>

        <!--even row-->
        <tr class="evenrow" align="center">
            <td>
                Total Time
            </td>
            <td>
                00:03:09
            </td>
        </tr>

        <!--odd row-->
        <tr class="oddrow" align="center">
            <td>
                Ticket Spent
            </td>
            <td>
                00:02:00
            </td>
        </tr>

        <!--even row-->
        <tr class="evenrow" align="center">
            <td>
                No. of staff worked
            </td>
            <td>
                2
            </td>
        </tr>

        <!--odd row-->
        <tr class="oddrow" align="center">
            <td>
                Ticket Status
            </td>
            <td>
                Closed
            </td>
        </tr>

        <!--even row-->
        <tr class="evenrow" align="center">
            <td>
                SLA
            </td>
            <td>
                Yes
            </td>
        </tr>

        <!--odd row-->
        <tr class="oddrow" align="center">
            <td>
                Type
            </td>
            <td>
                Issue
            </td>
        </tr>

        <!--even row-->
        <tr class="evenrow" align="center">
            <td>
                Red Flag
            </td>
            <td>
                0
            </td>
        </tr>

        <!--odd row-->
        <tr class="oddrow" align="center">
            <td>
                Yellow Flag
            </td>
            <td>
                0
            </td>
        </tr>

        <!--even row-->
        <tr class="evenrow" align="center">
            <td>
                Orange Flag
            </td>
            <td>
                0
            </td>
        </tr>

        <!--odd row-->
        <tr class="oddrow" align="center">
            <td>
                Closed by
            </td>
            <td>
                Harsha p
            </td>
        </tr>
    </table>

the jquery used is:

<script type="text/javascript">
      $(document).ready(function(){
        $(".smsSecond").draggable({containment: ".maincol"});//, revert: true

    $(".smsSecond").click(function(){
        $(this).hide(500);
    });

    $(document).bind("contextmenu", function(e) {

    $('.smsSecond').show(500);

    return false;

    });


});
    </script>

Answer 1

You can use offset to:

get the current coordinates of the first element in the set of matched elements, relative to the document

var offset = $(".smsSecond").offset();
var left = offset.left; 
var top = offset.top;

Depending on your needs, position may also be useful.